Отражение JavaScript и вывод HTML
В
JavaScript значения свойств объекта основаны на содержимом вашего HTML-документа, что иногда называется
reflection/отражением, поскольку значения свойств отражают HTML. Для понимания отражения JavaScript важно разобраться, как Navigator выполняет
layout\вывод – процесс трансформации Navigator'ом HTML-тэгов в графическое отображение на экране вашего компьютера.
Обычно отображение выполняется в Navigator'е последовательно: Navigator стартует от верха HTML-файла и проходит до конца документа (вниз), отображая вывод на экране по мере прохождения документа. Из-за такого выполнения «сверху вниз», JavaScript отражает только 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 отобразил этот заголовок в строке заголовка окна Navigator'а, Вы не можете изменить это значение в JavaScript. Если у вас имеется такой скрипт далее на странице, он не изменит значение
document.title, не повлияет на вид страницы или вызовет генерацию ошибки.
document.title = "The New Improved JavaScript Page"
Из этого правила есть несколько важных исключений: вы можете динамически обновлять значения элементов. Например, следующий скрипт определяет текстовое поле, которое первоначально выводит строку
Starting Value. При каждом щелчке по кнопке вы добавляете текст
...Updated! к этому значению.
<FORM NAME="demoForm">
<INPUT TYPE="text" NAME="mytext" SIZE="40" VALUE="Starting Value">
<P><INPUT TYPE="button" VALUE="Click to Update Text Field"
onClick="document.demoForm.mytext.value += '...Updated!' ">
</FORM>
Это простой пример обновления элемента формы после завершения вывода документа.
Используя обработчики событий, вы можете также изменять некоторые другие свойства после завершения вывода документа, такие как
document.bgColor.