![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
*** WEB Star *** #1 WEB фокусы
Java Script
Автор: Стрельников
Антон
Источник: http://wmzsponsorwmr.boom.ru
JavaScript - язык программирования, позволяющий сделать web-страницы еще более
интерактивными, добавить в них интересные визуальные эффекты, обеспечить возможность
вычислений и проверки выполнений условий.
JavaScript - интерпретируемый язык. Это значит, что броузер должен быть
снабжен специальным блоком, позволяющим ему выполнить программы, написанные
на языке JavaScript. Все современные броузеры могут работать с JavaScript.
Программа на языке JavaScript встраивается внутрь HTML-файла и загружается
из Интернета вместе с ним. Чаще всего программа помещается внутрь тега <HEAD>.
Полное руководство по языку JavaScript можно приобрести в специализированных
книжных магазинах, либо бесплатно скопировать из интернета.
И так преступим к изучению (детальному):
JavaScript воспринимает находящееся на дисплее окна, фреймы, страницы,
как объекты, обладающие набором свойств и происходящих событий. JavaScript
позволяет манипулировать этими свойствами, считывать и изменять параметры,
загружать и даже создавать страницы.
Все сказанное в равной степени относится и к размещенным на страниах формам
со всеми элементами. Строки и поле ввода, кнопки, переключатели и триггеры,
их свойства и событии происходящие с ними могут быть обработаны с помощью
JavaScript.
В своей работе JavaScript используют переменные для хранения промежутосных
результатов вычислений и значений свойств. Переменная в JavaScript и может
принимать как числовое, так и символьное значение.
Структурно программа на языке JavaScript строится по модульному принципу с
использованием процедур. Процедура представляет собой высилительный блок,
который вызывается обработчиком событий.
Все процедуры помещаются в контейнер <SCRIPT>...</SCRIPT>. Для
того, чтобы броузеры, не поддерживающие язык JavaScript не выводили на экран
текст программы он помечается как блок комменатриев (ремарок).
Бегущая строка в статусной области окна броузера может быть легко создана
с помощью простой JavaScript программы.
Вот код этой простой программы:
<SCRIPT LANGUAGE="JavaScript">
<!--
var scrollCounter = 0;
var scrollText = "*** Эта фраза будет пробегать в статусной строке ***";
var scrollDelay = 30;
var i = 0;
while (i ++ < 140)
scrollText = " " + scrollText;
function Scroller()
{
window.status = scrollText.substring(scrollCounter++,
scrollText.length);
if (scrollCounter == scrollText.length)
scrollCounter = 0;
setTimeout("Scroller()", scrollDelay);
}
Scroller();
//-->
</SCRIPT>
Текст вы можете заменить на свой. Меняя значения переменных, можно менять
скорость движения текста, интервал между появлениями бегущей строки. Обратите
внимание, что процедура вызывается событием ONLOAD, т.е. после загрузки странице
в броузере.
Очень красиво, когда картинки-кнопки при попадении на них курсора мышки меняет
свой вид - окрашивается, приподнимается и тому подобное. Простая JavaScript
- прграмма поможет вам реализовать свой эффект. Программа воспринимает положение
мышки над картинкой и загружает на её место другую картинку. Когда мышка "уходит"
с картинки, вновь загружается первоначальная картинка. Вот код этой программы:
<SCRIPT LANGUAGE="JavaScript">
<!--
k1on = new Image();
k1on.src = "k1b.gif";
k1off = new Image();
k1off.src = "k1.gif";
k2on = new Image();
k2on.src = "k2b.gif";
k2off = new Image();
k2off.src = "k2.gif";
k3on = new Image();
k3on.src = "k3b.gif";
k3off = new Image();
k3off.src = "k3.gif";
function img_on(imgName) {
imgOn = eval(imgName + "on.src");
document [imgName].src = imgOn;
}
function img_off(imgName) {
imgOff = eval(imgName + "off.src");
document [imgName].src = imgOff;
}
//-->
</SCRIPT>
С помощью JavaScript можно поместить на страницу часы. Процедура вывода на
экран текущего времени периодически вызывает сама себя. Часы показывают время,
установленное на компьютере посетителя сайта.
Вот код:
<script language="JavaScript">
<!--
function showTime() {
var timeNow = new Date();
var hours = timeNow.getHours();
var minutes = timeNow.getMinutes();
var seconds = timeNow.getSeconds();
var timeString = "";
timeString += ((hours < 10) ? "0" : "") + hours;
timeString += ((minutes < 10) ? ":0" : ":") + minutes;
timeString += ((seconds < 10) ? ":0" : ":") + seconds;
document.htmlClock.timeField.value = timeString;
timerID = setTimeout('showTime()', 1000);
}
//-->
</script>
Подсчитать сумму чисел введенных в поля формы очень легко. Надо только не
забывать о том, что переменные в JavaScript универсальны и склонны воспринимать
надписи в строках ввода, как последовательности символов.Для перевода из символьной
формы в числовую используется функция PARSEFLOAD. Вот что ва нужно поставить
на страницу, чтобы на ней появились часики:
<SCRIPT LANGUAGE="JavaScript">
<!--
var summa = 0;
function rezultat() {
summa = parseFloat(document.forms[0].price1.value);
summa = summa + parseFloat(document.forms[0].price2.value);
summa = summa + parseFloat(document.forms[0].price3.value);
document.forms[0].stoimost.value = summa;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<CENTER>
<INPUT name="price1" type="text" size=8 value="0">
<BR>
<INPUT name="price2" type="text" size=8 value="0">
<BR>
<INPUT name="price3" type="text" size=8 value="0">
<BR>
<INPUT name="rez" type="button" value="S U M M
A" onClick="rezultat()">
<BR>
<INPUT name="stoimost" type="text" size=8 value="0">
</CENTER>
</FORM>
Вот пожалуй и все, что нужно знать, для того чтобы делать всякие штучки. До
свидания.
© Copyright Алекс
aka TrigGer &
x-graphic studio
© Все права защищены.
Перепечатка
материалов разрешается, только после письменного разрешения автора (e-mail).
При перепечатке любого материала с журнала видимая ссылка на источник www.kovrik.hut.ru
и все имена, ссылки авторов обязательны.