Wiki-учебник по веб-технологиям: JavaScript/ОтражениеJavaScriptИВыводHTML ...

Главная | Каталог |

Отражение 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.