Опубликован: 19.10.2006 | Уровень: для всех | Доступ: платный
Лекция 9:

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

Аннотация: Структура объектов JavaScript, порядок их подчинения.

Концепция

Сделаем паузу и посмотрим, что мы уже знаем. В 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
Елена Сапегова
Елена Сапегова

После прохождения теоретической части пришло письмо об окончании теоретической части курса, будет ли практическая часть?

Эдуард Семынин
Эдуард Семынин

Здравствуйте.

Перестали быть видны лекции и тесты практикума по программированию на JavaScript. Уже второй день из моего аккаунта виден лишь план занятий. В чем может быть проблема?