Иерархия объектов

Концепция

Сделаем паузу и посмотрим, что мы уже знаем. В JavaScript есть объекты, похожие на существительные или предметы. У объектов есть свойства, которые описывают их, как прилагательные описывают существительное. Мы ссылаемся на свойства с помощью схемы oбъект.свойство.

Еще у объектов есть методы, или действия, которые можно выполнить с объектом. Все методы имеют скобки и используются по схеме oбъект.мeтoд(). У разных объектов имеются разные свойства и методы.

Теперь мы познакомимся с иерархией объектов JavaScript. Как только вы ее поймете, cчитайте, что вы освоили JavaScript!

Что имеется в виду

• Window
  • Parent
  • Self
    • Location
      • Href
    • Document
      • Image
        • Src
      • Form
        • Text
        • Submit
        • Checkbox
  • Top
  • Frames

Результат действия иерархии

Все ссылки начинаются с наивысшего объекта, window (окно браузера), и идут по нисходящей. Окна и рамки (frames) принадлежат объекту window. На них не нужно ссылаться, если только их не больше одного. Top, self, parent и frames — "встроенные" имена для окон. Не придавайте им большого значения, просто знайте, что они существуют.

Вот несколько примеров. Обратите внимание на иерархию.

document.mypic.src = "pic1.gif"

в самом начале window не требуется. Предполагается, что это все и так находится внутри окна. Команда document.mypic.src указывает на изображение с именем mypic, и изменяет его содержимое на "pic1.gif". В данном случае document (документ) — это страница на которой находится элемент, mypic — имя элемента, а SRC — источник элемента ( "pic1.gif" ).

document.write(location.href)

write() — это метод объекта document. location.href содержит полный URL окна. Обратите внимание, что location и dосument находятся на одном уровне. Это значит, что вы получаете адрес документа того же уровня.

Разбор иерархии объектов

• Window
  • Parent
  • Self
    • Location
      • Href
    • Document
      • Image
        • Src
      • Form
        • Text
        • Submit
        • Checkbox
  • Top
  • Frames

• Самая большая путаница в том, что некоторые объекты также являются и свойствами.
• window — только объект.
• document является свойством окна, но в свою очередь и объектом.
• form — это свойство документа, но также и объект со своими свойствами!
• value (значение) и SRC (источник) — только свойства!
• Здесь представлены не все объекты и свойства. Однако этого достаточно, чтобы понять концепцию в целом... Все ссылки начинаются сверху от window и идут по нисходящей. То есть, нельзя написать document.mytext.myform или mypic.src.document. Это неправильный порядок, следует писать слева направо от более общего к более конкретному.
• Важное замечание: чтобы показать содержимое поля формы, необходимо использовать свойство value (значение), например, document.myform.mytext.value! Если написать просто document.myform.mytext, то будет получена информация о поле формы, но не о его содержании!

Считайте value ("значение") некоторым показателем того, что нечто имеется или отсутствует в определенное время. Поле с флажком может иметь значение "on" или "off", в зависимости от того, задан он или нет. Текстовое поле может иметь значение "hidden" (скрытое), если вы не хотите, чтобы пользователь его видел. Текстовое поле, как указано выше, может содержать какую-то запись. Она будет значением этого поля.

Задание

Напишите полные ссылки, начиная с window, даже если это не требуется. Обратите внимание, что изображение имеет имя mypic, а форма — myform.

1. Ссылка на всю форму:
2. Ссылка на содержимое поля lname:
3. Ссылка на содержимое поля fname:
4. Замените изображение на "marigold.gif":

Ответы

1. window.document.myform
2. window.document.myform.lname.value
3. window.document.myform.fname.value
4. window.document.mypic.src=marigold.gif