Чтение онлайн

До сих пор в этой главе мы рассматривали документы как некие абстрактные деревья элементов и текстовых узлов. Но когда броузер отображает документ в своем окне, он создает визуальное представление документа, в котором каждый элемент имеет определенную позицию и размеры. Часто веб-приложения могут интерпретировать документы как деревья элементов и никак не заботиться о том, как эти элементы отображаются на экране. Однако иногда бывает необходимо определить точные геометрические характеристики элемента. Например, в главе 16 мы увидим, что элемент можно поместить в определенную позицию с помощью CSS. Если вам потребуется использовать CSS для динамического позиционирования элемента (такого как всплывающая подсказка или сноска) рядом с элементом, который позиционируется броузером, вам необходимо иметь возможность определять положение этого элемента.

В этом разделе рассказывается, как можно переходить от абстрактной, древовидной модели документа к геометрическому, основанному на системе координат визуальному представлению документа в окне броузера, и обратно. Свойства и методы, описываемые здесь, реализованы в броузерах достаточно давно (хотя есть некоторые, которые до недавнего времени присутствовали только в ІЕ, а некоторые не были реализованы в ІЕ до появления версии ІЕ9). К моменту написания этих строк они проходили процесс стандартизации консорциумом W3C в виде стандарта «CSSOM-View Module» .

Позиция элемента измеряется в пикселах. Координата X растет слева направо, а координата Y - сверху вниз. Однако существуют две точки, которые мы можем считать началом координат: координаты X и Y элемента могут отсчитываться относительно верхнего левого угла документа или относительно верхнего левого угла видимой области. Для окон верхнего уровня и вкладок «видимой областью» является часть окна броузера, в которой фактически отображается содержимое документа: в нее не входит обрамление окна (меню, панели инструментов, вкладки). Для документов, отображаемых во фреймах, видимой областью является элемент

, определяющий фрейм. В любом случае, когда речь заходит о позиции элемента, необходимо знать, какая система координат используется - относительно начала документа или относительно начала видимой области. (Координаты видимой области видимости иногда называют оконными координатами.)