JavaScript
JavaScript - предназначен для написания сценариев для активных HTML-страниц. Язык JavaScript не имеет никакого отношения к языку Java. Java разработан фирмой SUN. JavaScript – фирмой Netscape Communication Corporation. Первоначальное название – LiveScript. После завоевания языком Java всемирной известности LiveScript из коммерческих соображений переименовали в JavaScript.
JavaScript не предназначен для создания автономных приложений. Программа на JavaScript встраивается непосредственно в исходный текст HTML-документа и интерпретируется брaузером по мере загрузки этого документа. С помощью JavaScript можно динамически изменять текст загружаемого HTML-документа и реагировать на события, связанные с действиями посетителя или изменениями состоятия документа или окна.
Важная особенность JavaScript – объектная ориентированность. Программисту доступны многочисленные объекты, такие, как документы, гиперссылки, формы, фреймы и т.д. Объекты характеризуются описательной информацией (свойствами) и возможными действиями (методами).
Тег <SCRIPT>
Сценарий JavaScript встраивается в HTML-документ с помощью тега <SCRIPT>.
Пример<HTML>
<HEAD>
<meta http-equiv=Content-Type
content="text/html; charset=windows-1251">
</HEAD>
<BODY lang=RU>
<H1>Начнем?</H1>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write("Привет!");
//-->
</SCRIPT>
</BODY>
</HTML>
РЕЗУЛЬТАТ:
Начнем?Привет!
Атрибут LANGUAGE указывает язык программирования. Если мы имеем дело с HTML версии 4.0, то вместо LANGUAGE рекомендуется использовать атрибут TYPE в следующем виде: <SCRIPT TYPE="text/javascript">
Текст сценария оформляется как комментарий, чтобы не было проблем у посетителей, брaузеры которых не понимают JavaScript. Кроме того к символам, завершающим комментарий добавляется еще два символа "/”, т.к. некоторые браузеры, например, Netscape Navigator рассматривает строку, состоящую только из символов "-->”, как ошибочную.
В первом примере для объекта с именем document вызывается метод write. В качестве параметра ему передается текстовая строка "Привет!”. Строка закрывается символом ";”, которым отделяются друг от друга все операторы JavaScript.
Объект document – это HTML-документ, загруженный в окно брaузера. Метод write записывает в тело HTML-документа строку "Привет!”. При этом документ будет выгдядеть так, как будто эта строка находится в нем на месте сценария.
Имейте в виду, что JavaScript различает строчные и прописные буквы. Кроме того символ дефиса в JavaScript распознается как минус, т.е. если фон объекта в HTML-документе задается через свойство background-color, то в JavaScript - через backgroundColor.
Пример
<img src="ba.gif" border=0
OnMouseOver="this.style.backgroundColor='red';"
OnMouseOut="this.style.backgroundColor='white';">
Здесь цвет фона объекта будет меняться с белого на красный при наведении на объект мыши:
Переменные в JavaScript
Имя переменной не должно совпадать с зарезервированными ключевыми словами JavaScript.
Все переменные в JavaScript объявляются с помощью ключевого слова var. При объявлении тип переменной не указывается. Этот тип присваивается переменной только тогда, когда ей присваивается какое-либо значение.
Числа в строки интерпретатор JavaScript преобразует автоматически. Для преобразования строк в числа используют специальные функции parseInt и parseFloat.
Пример<HTML>
<HEAD>
<meta http-equiv=Content-Type content="text/html; charset=windows-1251">
</HEAD>
<BODY lang=RU>
<H1>Пример преобразования типов</H1>
<SCRIPT LANGUAGE="JavaScript">
<!--
var Buf="";
Buf=100+" - число сто<br>";
Buf+=(parseInt("50")+50)+" -число сто<br>";
document.write(Buf);
//-->
</SCRIPT>
</BODY>
</HTML>
РЕЗУЛЬТАТ:
Пример преобразования типов100 - число сто 100 - число сто
Операторы языка JavaScript
Операторы JavaScript напоминают общеизвестные операторы языка С++.
Унарные операторы
- |
Изменение знака на противоположный |
! |
Дополнение. Используется для реверсирования значения логических переменных |
++ |
Увеличение значения переменной. Может применяться и как префикс, и как суффикс |
-- |
Уменьшение значения переменной. Может применяться и как префикс, и как суффикс |
Бинарные операторы
- |
Вычитание |
+ |
Сложение |
* |
Умножение |
/ |
Деление |
% |
Остаток от деления |
Операторы для работы с отдельными битами
& |
И |
| |
ИЛИ |
^ |
ИСКЛЮЧАЮЩЕЕ ИЛИ |
~ |
НЕ |
Операторы сдвига
>> |
Сдвиг вправо |
<< |
Сдвиг влево |
>>> |
Сдвиг вправо с заполнением освобождаемых разрядов нулями |
Операторы отношения
> |
Больше |
>= |
Больше или равно |
< |
Меньше |
<= |
Меньше или равно |
== |
Равно |
!= |
Не равно |
В условных операторах также применяются логические операторы: || (ИЛИ) и && (И).
Оператор присваивания и его комбинации
Допускается комбинирование оператора присваивания с другими, как и в языке С.
= |
Присваивание |
+= |
Сложение или слияние строк (n=n+7; аналог. n+=7;) |
–= |
Вычитание (n=n-7; аналог. n-=7;) |
*= |
Умножение |
/= |
Деление |
>>= |
Сдвиг вправо |
<<= |
Сдвиг влево |
>>>= |
Сдвиг вправо с заполнением освобождаемых разрядов нулями |
&= |
И |
|= |
ИЛИ |
^= |
ИСКЛЮЧАЮЩЕЕ ИЛИ |
Условные операторы
В языке JavaScript два условных оператора: if-else и ?:.
Пример оператора IF-ELSEif(Vol<2)
{
b=true;
ss="w002.htm";
}
else if(Vol>100)
{
b=true;
ss="w100.htm";
}
Пример оператора ?:b = (Vol<2 || Vol>100) ? true:false;
Операторы цикла
В языке JavaScript три оператора цикла: for, for-in, while.
Пример оператора FORfor(i=0; i<n; i++)
{
text+=" ";
}
Пример оператора FOR-INvar sprops="<H2>Свойства объекта window</H2>"
for(props in window)
sprops+="<b>"+props+"</b><xmp>"+(":"+window[props]).substr(0,90)+"</xmp><br>";
document.write(sprops);
РЕЗУЛЬТАТ:
Свойства объекта windowstatus: onresize: null onmessage: null parent: [object] onhashchange: null defaultStatus: name: sitemap history: [object] maxConnectionsPerServer: 2 opener: undefined location: http://www.htmlweb.ru/java/js.php screenLeft: 0 document: [object] onbeforeprint: null screenTop: 143 clientInformation: [object] onerror: null onfocus: null event: null onload: function onload() { BeginFly() } onblur: null window: [object] closed: false screen: [object] onscroll: null length: 0 frameElement: null self: [object] onunload: null onafterprint: null navigator: [object] frames: [object] sessionStorage: [object] top: [object] clipboardData: [object] external: undefined onhelp: null offscreenBuffering: auto localStorage: [object] onbeforeunload: null
Пример оператора WHILEi=0;
while(i<n)
{
text+=" ";
i++;
}
Кроме этих операторов в организации цикла могут участвовать еще два оператора: break (выход из цикла) и continue (переход на следующий шаг).
Прочие операторы
. |
Доступ к полю объекта. ( document.write(Buf); ) |
[ ] |
Индексирование массива ( dim[i] ) |
( ) |
Изменение порядка вычислений или передача параметров функции |
, |
Разделение выражений в многократном вычислении |
Пример оператора "запятая”for(i=0; i<n; i++, j++)
Встроенные функции JavaScript
Функции JavaScript
Все функции JavaScript рекомендуется помещать в контейнер <HEAD>...</HEAD>. Тем самым вы обеспечите их гарантированную доступность при обработке HTML-документа.
Пример<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=windows-1251">
<script language="Javascript">
<!--
function ItR(a)
{
var o = eval(a);
o.style.backgroundColor="red";
}
function ItW(a)
{
var o = eval(a);
o.style.backgroundColor="white";
}
//-->
</script>
</head>
<body lang=RU>
<H2>Изменение
фона при наведении </H2>
<img id=Ba src="ba.gif" border=0 OnMouseOver="ItR(Ba)" OnMouseOut="ItW(Ba)">
<img id=Ba src="be.gif" border=0 OnMouseOver="ItR(Be)" OnMouseOut="ItW(Be)">
</body>
</html>
РЕЗУЛЬТАТ:
Изменение фона при наведении
Объекты JavaScript
Язык JavaScript является объектно-ориентированным. Объекты JavaScript представляют собой наборы свойств и методов. Можно сказать, что свойства объектов - это данные, связанные с объектом, а методы - функции для обработки данных объекта.
В языке JavaScript имеется три вида объектов: встроенные объекты, объекты брaузера и объекты, создаваемые программистом.
JavaScript поддерживает следующий набор встроенных объектов: Array, Boolean, Date, Global, Function, Math, Number, String.
|