Скрипт-программа размещается непосредственно на HTML странице, как правило внутри тега
HTML файла.Она загружается в браузер вместе с файлом.
А именно JavaScript может быть внедрен в HTML документе двумя способами:
<SCRIPT> JavaScript statements... </SCRIPT>Необязательный атрибут LANGUAGE определяет язык создания сценария следующим образом:
<SCRIPT LANGUAGE="JavaScript"> JavaScript statements... </SCRIPT>В документе HMTL теги <SCRIPT>, и закрывающий тег </SCRIPT> могут содержать любое количество утверждений JavaScript. Чтобы наглядно увидить как пишутся скрипты на языке JavaScript рассмотрим простой пример скрипт-программы расположенной на сторанице HTML:
<html>
<head><title>Скрипт-программа</title>
<script language="JavaScript">
<!Здесь располагаются строки скрипт-программы!>
</script>
<head>
<body onload="scroll_start();"onunload="scroll_stop();">
<!А здесь распологаются теги HTML страницы!>
</body>
</html>
В этом примере внутри тега <BODY> указано событие ONLOAD, по которому скрипт-программа запускается сразу после загрузки. Событиями также могут являться щелчком или перемещение указателя мышки.
Скрипты могут размещаться внутри области комментария, чтобы ваше утверждение JavaScript не просматривалось старыми окнами браузера, которые не распознают JavaScript. Тогда весь сценарий спрятан в HTML- страницу тегами комментария:
<!-- Begin to hide script contents from old browsers.
// End the hiding here. -->
JavaScript загружается в браузер вместе с файлом. Запуск программы присходит тогда, когда совершается некоторое событие, на которое указано в файле. Функции сохранены, но не выполнены. Они будут выполнены тогда, когда в странице указано события его выполнения.
Важно понять разность между определением функции и запроса функции. Определение функции просто называет функцию и определяет, что и когда делать. Запрос функции фактически выполняет указанные действия в определении функции. Следующий пример демонстрирует скрипт с функцией и комментариями:
Документ готов.
Вы должны определить функции на странице в теги HTML документа. Так как HTML грузится сначала, что гарантирует функции загрузиться прежде, чем пользователь вызовет функцию.
Thanks.
Пример скрипта с двумя функциями:
Приложениями JavaScript в Навигаторе мы в основном управляем событиями. События (Events)- это действия, которые происходят, обычно в результате чего - нибудь, что делает пользователь (например, щелчок кнопки мышки). Имеется определенный набор событий, которые Навигатор распознает. Вы можете определить обработчики результатов скриптов, которые автоматически выполняются, когда происходит результат.
Обработчик Результата записываются в документ как атрибут тега HTML, к которому вы приписываете код JavaScript, для выполнения. Общий вид:
Например вы создали функцию JavaScript, и назвали ее compute. Вы можете заставить Навигатор выполнять эту функцию, когда пользователь нажимает на кнопку,в которой к onClick приписан обработчик результата кнопки:
Вы можете помещать любые утверждения JavaScript внутри ковычек onClick. Эти утверждения будут выполнены, когда пользователь нажмет на кнопку. Если Вы хотите включить больше чем одно утверждение, отдельные утверждения записываются через точкой с запятой (;).
Вообще, это - хорошая идея определить функцию для ваших обработчиков результата потому что:
В этом примере используется this.form, чтобы обратиться к текущей форме. Ключевое слово обращается к текущему объекту - в вышеупомянутом примере, объекту кнопки. Затем конструкция this.form обращается к форме, содержащей кнопку. Там же, onClick обработчик результата - запрос к функции compute(), с this.form, текущей формой, как параметр функции.
События обращаются к тегам HTML следующим образом:
Если события обращаются к тегам HTML, то для этого вы можете определять обработчик событий. Вообще, обработчик событий имеет имя события, прещедствующее "on". Например, обработчик результата для результата Focus - onFocus.
Много объектов также имеют методы, которые подражают событиям. Например, кнопка имеет метод щелчка, который подражает нажимаемой кнопке. Заметьте: методы подражаемые событиям не вызывают обработчика событий. Так, например, метод щелчка не вызывает обработчика результата onClick. Однако, Вы можете всегда вызывать обработчик результата (например, Вы можете вызывать onClick явно в сценарие).
Метод | Происходит когда ... | Обработчик Результата |
---|---|---|
Blur | Пользователь удаляет строку фокус из элемента формы | OnBlur |
click | Пользователь нажимает на элемент формы или link | OnClick |
change | Пользователь изменяет значение text, textarea, или select элемента | OnChange |
Focus | Пользователь передает фокус указанному элементу формы | OnFocus |
load | Пользователь загружает страницу в Navigator | OnLoad |
Mouseover | Происходит, когда пользователь помещает указатель мышки над гиперссылкой | OnMouseOver |
Select | Пользователь выделяет область ввода указанного элемента формы | OnSelect |
Submit | Пользователь подчиняет форму | OnSubmit |
Unload | Пользователь выходит из страницы | OnUnload |
Приведем сценарий "калькулятор" с формой и атрибутом обработчика результата.
Сценарий с формой и атрибутом обработчика результата внутри тега BODY.
Этот раздел описывает различные полезные методы создания сценария.
Результаты JavaScript в Navigator вызываются из вершины загруженной страницы. Если вы хотите что - нибудь форматировать,то вы не можете изменить это без перезагрузки страницы. В настоящее время, Вы не можете модернизировать частную часть страницы без модифицирования всей страницы. Хотя, вы можете модернизировать "sub-window" (незначительную часть окна) в фрейме отдельно.
Вы не можете в настоящее время напечатать вывод, созданный с JavaScript. Например, если у вас есть следующее в странице:
This is some text.
Убедитесь, что бы чередовали двойные котировки с одиночными ковычками. Так как обработчики событий в HTML должны быть расположены в кавычках, вы должны использовать одиночные ковычки, чтобы разграничить аргументы. Например
В качестве альтернативы, вы можете выйте из ковычек, предшествуя им наклонной чертой влево (\).
Хорошо определять все ваши функции в HEAD вашей HTML страницы. Потому, что все функции будут определены прежде, чем любое содержание показано. Иначе, пользователь может выполнять какое - нибудь действие, в то время как страница все еще загружается, которое вызывает обработчик событий и вызывает неопределенную функцию, ведя к ошибке.
Массив - упорядоченное множество значений, на которые вы ссылаетесь через имя массива и индекс. Например, у вас есть массив, с именем emp, который содержит имена служащих, индексированные их номером служащего. Так emp [1] будет служащий номер один, emp [2] служащий номер два, и так далее.
JavaScript не имеет явный тип данных массива, но из-за близкой связи между массивами и объектами свойств (смотрите Объектная Модель JavaScript). Вы можете определять тип объекта массива, следующим образом:
function MakeArray(n) {
this.length = n;
for (var i = 1; i <= n; i++) {
this[i] = 0 }
return this
}
}
Здесь определяется массив такой что первое свойство, длина, (с индексом ноля), представляет число элементов в массиве. Оставшиеся свойства имеют индекс целого числа один или больше, и инициализированы к нолю.
Вы можете создавать массив вызывая new с именем массива, определяя число элементов, которые имеет. Например:
emp = new MakeArray(20);
Здесь создается массив, с именем emp с 20 элементами, и элементы инициализируется к нолю.
Вы можете заполнять массив, просто присваивая значения к ее элементам. Например:
emp[1] = "Casey Jones"
emp[2] = "Phil Lesh"
emp[3] = "August West"
И так далее.
Вы можете также создавать массивы объектов. Например, пусть вы определяете тип объекта, именованный Employees, следующим образом:
function Employee(empno, name, dept) {
this.empno = empno;
this.name = name;
this.dept = dept;
}
Затем следующие утверждения определяет массив этих объектов:
emp = new MakeArray(3)
emp[1] = new Employee(1, "Casey Jones", "Engineering")
emp[2] = new Employee(2, "Phil Lesh", "Music")
emp[3] = new Employee(3, "August West", "Admin")
Затем Вы можете легко показывать объекты в этом массиве, используя функцию show_props (определенную в разделе Объектная Модель JavaScript) следующим образом:
for (var n =1; n <= 3; n++) {
document.write(show_props(emp[n], "emp") + "
");
}