|
||||||||||||||||
| <Добавить в Избранное> <Сделать стартовой> <Реклама на сайте> <Контакты> | ||||||||||||||||
|
||||||||||||||||
| ||||||||||||||||
|
| ||||||||||||||||
Интернет технологии -> JavaScript -> Программирование в JavaScript | ||||||||||||||||
|
Глава 3. Использование объектов Navigator'а Излагаемый здесь материал относится в основном к JavaScript-клиенту. Объекты Navigator'а имеют следующую иерархию:
При загрузке документа выполняется порядковая нумерация однотипных объектов и полное имя объекта формируется с использованием названия объекта и его номера. Например, первая форма в документе получит название form1. Поскольку она является дочерним элементом объекта document, обратиться к ней можно следующим образом: document.form1. Каждая страница имеет следующие объекты:
В зависимости от содержания, документ может иметь и другие объекты.: например, каждая форма (определяемая в теге FORM) в документе представляет объект Form. Следующая ссылка относится к свойству value текстового поля с именем text1 в форме, названной myform, текущего документа: document.myform.text1.value Когда объект включен в форму, для обращения к нему необходимо указывать имя формы, даже в том случае, когда объект может существовать вне формы. Например рисунок (image) может существовать вне формы, но если он в нее включен, то обращение должно выглядеть следующим образом: document.imageForm.aircraft.src='f15e.gif' В том случае, если рисунок вне формы, обращение будет следующим: document.aircraft.src='f15e.gif' 3.1.1 Примеры свойств документа. Предположим мы создали страницу, поименованную simple.html, со следующим содержимым: <HEAD><TITLE>My Document</TITLE>
<SCRIPT>
function update(form) {
alert("Form being updated")
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myform" ACTION="foo.cgi" METHOD="get" >
Enter a value:
<INPUT TYPE="text" NAME="text1" VALUE="everything"
SIZE=20>
Check if you want:
<INPUT TYPE="checkbox" NAME="Check1" CHECKED
onClick="update(this.form)"> Option #1
<P>
<INPUT TYPE="button" NAME="button1" VALUE="Press Me"
onClick="update(this.form)">
</FORM>
</BODY>
Базовые объекты могут иметь следующие свойства:
Значение document.title определяется содержимым тега TITLE, значения document.fgColor и document.bgColor явным образом не определены, поэтому они выбираются по умолчанию из установок диалогового бокса Preferences (когда пользователь выбирает General Preferences из меню Options). Полные имена объектов в выше приведенном документе будут следующими:
Объект myform имеет свойства, основывающиеся на аттрибутах тега FORM: - action есть http://www.sampson.com/samples/foo.cgi, URL, на который указывает форма. - method есть "get" как указано в аттрибуте METHOD . - length равна 3, поскольку в форме три элемента ввода. Объект Form имеет дочерние объекты button1 и text1, эти объекты обладают своими собственными свойствами, например: button1.value имеет значение "Press Me" , button1.name - "Button1" text1.value - "everything" text1.name - "text1". На эти свойства следует ссылаться, используя полные имена, например: document.myform.button1.value. 3.2 Исполнение JavaScript-программ Чтобы понимать исполнение JavaScript-программы, важно знать как они исполняются Navigator'ом - то есть как Navigator преобразует HTML теги в графическое отображение. В общем случае Navigator исполняет файл HTML сверху вниз. Например, предположим, что определена форма с двумя элементами ввода текста: <FORM NAME="statform"> <INPUT TYPE = "text" name = "userName" size = 20> <INPUT TYPE = "text" name = "Age" size = 3> Эти элементы формы определены как JavaScript-объекты и их можно использовать после того, как форма определена следующим образом: document.statform.userName и document.statform.Age. Например, можно показать значение этих объектов в программе после заполнения формы: <SCRIPT> document.write(document.statform.userName.value) document.write(document.statform.Age.value) </SCRIPT> (Чтобы увидеть только что введенные значения необходимо перезагрузить документ.) Однако, если попробовать сделать это перед определением формы (выше заполнения формы в HTML странице), получите ошибку, потому что объекты не существуют еще в Navigator'е. Аналогично, если расположение объекта на экране произошло, то установка нового значения не приведет к изменению изображения. Например, предположим заголовок документа определен следующим образом: <TITLE>My JavaScript Page</TITLE> Для JavaScript это значение переменной document.title. Navigator выводит этот заголовок в своей верхней строке. Если позже попытаться изменить значение этой переменной, то это не вызовет изменение изображения, не приведет к изменению переменной и может вызвать ошибку. Имеются некоторые важные исключения из этого правила: Можно модернизировать значения элементов формы динамически. Например, следующее описание определяет область текста, который первоначально показывает строку "Source value". Когда вы нажимаете кнопку, добавляется новый текст "...Updated". <FORM NAME="demoForm"> <INPUT TYPE="text" NAME="mytext" SIZE="40" VALUE="Source value "> <P><INPUT TYPE="button" VALUE="Click to Update Text Field" onClick="document.demoForm.mytext.value += '...Updated ' "> </FORM> Это простой пример обновления элемента формы после расположения. При использовании программ-обработчиков событий можно также изменить некоторые другие свойства после того, как расположение произошло, например, document.bgcolor. |
| ||||||||||||||||
| ||||||||||||||||
| Copyright © CompDoc.Ru | ||||||||||||||||
| При цитировании и перепечатке ссылка на www.compdoc.ru обязательна. Карта сайта. |