DOM Inspector - элементы красного цвета

MySh · №1

Почему в DOM Inspector некоторые элементы красного цвета? Они чем-то отличаются от обычных?

Anton · №2

MySh пишет

Почему в DOM Inspector некоторые элементы красного цвета? Они чем-то отличаются от обычных?

Why do some nodes in the Document DOM Nodes viewer appear in red?
These nodes are anonymous content nodes, meaning they are not in the DOM generated by the original document.

https://developer.mozilla.org/ru/docs/DOM_Inspector/DOM_Inspector_FAQ

MySh · №3

Anton
Спасибо. То есть, если я правильно понял, эти элементы берутся не из основного кода, а из из другого места (XBL?).
А можно хотя бы в двух словах пояснить, что такое bindings и зачем они нужны? Я прочёл справку, но, честно говоря, всё равно не очень понял. Понял только, что это что-то, основанное на XML, и оно, судя по всему, сильно сложнее того же XUL (который я тоже, в общем, не особенно хорошо знаю ).

Anton · №4

MySh пишет

То есть, если я правильно понял, эти элементы берутся не из основного кода, а из из другого места (XBL?).

Ну, если считать "original document" "основным кодом", то, наверное, можно и так сказать.

MySh пишет

А можно хотя бы в двух словах пояснить, что такое bindings и зачем они нужны? Я прочёл справку,

В справке написано

The bindings element is the root element of any XBL document.
...
bindings contains zero or more binding elements as children.

MySh пишет

но, честно говоря, всё равно не очень понял.

Вот ссылка, может по прочтении будет понятней: http://www.intuit.ru/studies/courses/11 … cture/5552. Кстати, в теме Русская документация по разработке на XUL есть ссылка на весь курс.

MySh · №5

Anton
Спасибо, на русском читать куда приятней. Но понятно далеко не всё, многие понятия объясняются через другие понятия, которые тоже не понятны. Поэтому в моём случае начинать нужно с чего-то для полных чайников.
Отдельное спасибо за ссылку на тему с русской документацией, возможно, там я сумею найти то, что нужно. Хотя многие ссылки уже битые (по одной, например, предлагают оптом купить носки )…

Anton · №6

MySh пишет

Anton
Спасибо, на русском читать куда приятней. Но понятно далеко не всё, многие понятия объясняются через другие понятия, которые тоже не понятны. Поэтому в моём случае начинать нужно с чего-то для полных чайников.
Отдельное спасибо за ссылку на тему с русской документацией, возможно, там я сумею найти то, что нужно. Хотя многие ссылки уже битые (по одной, например, предлагают оптом купить носки )…

Там термины, а тут носки, ситуация практически безвыходная.
Все же с носками надо попробовать что-нибудь сделать.

Infocatcher · №7

MySh пишет

Но понятно далеко не всё, многие понятия объясняются через другие понятия, которые тоже не понятны.

Вот есть исходный код документа, там прописаны какие-то тэги, они в DOM Inspector'е будут черными. А есть специальная технология под названием XBL, позволяющая привязать к нужным узлам дополнительное описание, в котором можно задать как поведение (реакцию на события типа кликов пользователя), так и внутренности. В результате можно написать в исходном коде <toolbarbutton />, а движок превратит это в

Выделить код

Код:

<toolbarbutton>
    <xul:image class="toolbarbutton-icon" />
    <xul:label class="toolbarbutton-text" />
</toolbarbutton>

Вот эти image и label, которых не было в исходном коде, и будут анонимными (и DOM Inspector подсветит их красным).

Anton · №8

Infocatcher пишет

Вот эти image и label, которых не было в исходном коде, и будут анонимными

Если верить справке, то особенное отличие анонимных узлов не в том, что они определяются где-то в другом месте, а в том, что они находятся в другой области видимости, их родительские элементы о них ничего не знают, и к ним поэтому нельзя получить доступ обычными способами через childNodes, firstChild-nextSibling и т. п. И, похоже, что эти анонимные элементы хотя и по большей части, но не обязательно определяются через XBL. Например в элементах window и page есть анонимные элементы popupgroup и tooltip, также встречаются анонимные узлы _moz_generated_content_before/after, а XBL "исходников" для них в omni.ja не находится.

MySh · №9

Infocatcher

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

Спасибо, я примерно так и понял.

Anton

похоже, что эти анонимные элементы хотя и по большей части, но не обязательно определяются через XBL. Например в элементах window и page есть анонимные элементы popupgroup и tooltip, также встречаются анонимные узлы _moz_generated_content_before/after, а XBL "исходников" для них в omni.ja не находится.

Если верить DOM Inspector, для элемента tooltip вроде какие-то XBL-связки есть.

Просмотрел ещё раз ссылки, почти все не работают или ведут не туда, но кое-что всё же нашёл: XUL.ru - О XUL и Mozilla - на русском языке и Создание расширений к Mozilla Firefox. Для начала уже неплохо. Но, как я понимаю, без знания JavaScript тут делать нечего.

Anton · №10

MySh пишет

Если верить DOM Inspector, для элемента tooltip вроде какие-то XBL-связки есть.

Для привязки к элементам tooltip XBL-связки есть. А "исходников", которые создают анонимные элементы tooltip в элементах window и page - нет.

MySh · №11

Anton

Для привязки к элементам tooltip XBL-связки есть. А "исходников", которые создают анонимные элементы tooltip в элементах window и page - нет.

А в DOM Inspector это где-нибудь можно увидеть?

Anton · №12

MySh пишет

А в DOM Inspector это где-нибудь можно увидеть?

Можно.
http://i024.radikal.ru/1401/34/31e26224b365.png
http://s019.radikal.ru/i627/1401/fd/28354c4002be.png

Отредактировано Anton (09-01-2014 18:06:12)

MySh · №13

Anton
Гм. На снимках экрана я этого не вижу…

Anton · №14

MySh пишет

Гм. На снимках экрана я этого не вижу…

Нежелание топикстартера видеть очевидные вещи понятно с первых сообщений, так что неудивительно.

Вот в документах chrome://navigator/content/navigator.xul или chrome://browser/content/browser.xul у элемента window есть анонимные дочерние узлы popupgroup и tooltip. К этому элементу window привязан xbl chrome://global/content/bindings/general.xml#root-element, в котором не определяются ни popupgroup, ни tooltip. Вывод - похоже, что анонимные узлы создаются не одним только xbl.

MySh · №15

Anton

Вот в документах chrome://navigator/content/navigator.xul или chrome://browser/content/browser.xul у элемента window есть анонимные дочерние узлы popupgroup и tooltip. К этому элементу window привязан xbl chrome://global/content/bindings/general.xml#root-element, в котором не определяются ни popupgroup, ни tooltip.

Спасибо, теперь стало ясно. То есть, надо смотреть в код этого самого chrome://global/content/bindings/general.xml#root-element, а из DOM Inspector этого не увидишь.

скрытый текст

Нежелание топикстартера видеть очевидные вещи понятно с первых сообщений, так что неудивительно.

Всё проще: как говорится, «не стоит сразу видеть злой умысел в том, что вполне можно объяснить глупостью.» . Таки да, топикстартер — полный чайник (что он, кстати, никогда и не скрывал ) :dumb: . Прошу прощения, если это так сильно раздражает.
С целью хоть чуть-чуть ликвидировать среди себя неграмотность и была создана эта тема. «С чувством глубокого удовлетворения» могу констатировать, что цель более-менее достигнута.

Спасибо всем отписавшимся!

Anton · №16

MySh пишет

То есть, надо смотреть в код этого самого chrome://global/content/bindings/general.xml#root-element, а из DOM Inspector этого не увидишь.

Опять ты за свое

Чтобы увидеть, что XBL не создает какой-то анонимный узел, не обязательно смотреть его код.

Вот смотри: http://s020.radikal.ru/i716/1401/af/303dc47b8da2.png
Слева - toolbarbutton с анонимными xul:toolbarbutton и xul:dropmaker, справа - соответствующий xbl chrome://global/content/bindings/toolbarbutton.xml#menu-button с xul:toolbarbutton и xul:dropmaker в содержимом.

А вот: http://s019.radikal.ru/i614/1401/35/d6120a8c88c6.png слева window с анонимными popupgroup и tooltip, а справа - chrome://global/content/bindings/general.xml#root-element, но в контенте у него пусто.

Но можно и код посмотреть, на скриншотах виден соответствующий пункт контекстного меню.

MySh · №17

Anton

Чтобы увидеть, что XBL не создает какой-то анонимный узел, не обязательно смотреть его код.
Вот смотри: http://s020.radikal.ru/i716/1401/af/303dc47b8da2.png
Слева - toolbarbutton с анонимными xul:toolbarbutton и xul:dropmaker, справа - соответствующий xbl chrome://global/content/bindings/toolbarbutton.xml#menu-button с xul:toolbarbutton и xul:dropmaker в содержимом.
А вот: http://s019.radikal.ru/i614/1401/35/d6120a8c88c6.png слева window с анонимными popupgroup и tooltip, а справа - chrome://global/content/bindings/general.xml#root-element, но в контенте у него пусто.

Надо же, действительно, не заметил. И вроде как на самом виду — но для новичка совершенно неочевидно. Теперь буду знать, спасибо!

Но можно и код посмотреть, на скриншотах виден соответствующий пункт контекстного меню.

Ну да, я именно так и делал.

Полезная информация

№105-01-2014 22:35:30

DOM Inspector - элементы красного цвета

№205-01-2014 23:10:56

Re: DOM Inspector - элементы красного цвета

№306-01-2014 00:39:21

Re: DOM Inspector - элементы красного цвета

№406-01-2014 02:29:37

Re: DOM Inspector - элементы красного цвета

№506-01-2014 20:52:27

Re: DOM Inspector - элементы красного цвета

№606-01-2014 21:45:03

Re: DOM Inspector - элементы красного цвета

№707-01-2014 00:33:16

Re: DOM Inspector - элементы красного цвета

Код:

№807-01-2014 13:10:27

Re: DOM Inspector - элементы красного цвета

№907-01-2014 16:28:17

Re: DOM Inspector - элементы красного цвета

№1007-01-2014 17:58:39

Re: DOM Inspector - элементы красного цвета

№1108-01-2014 21:10:29

Re: DOM Inspector - элементы красного цвета

№1209-01-2014 18:01:39

Re: DOM Inspector - элементы красного цвета

№1309-01-2014 22:18:27

Re: DOM Inspector - элементы красного цвета

№1412-01-2014 19:05:05

Re: DOM Inspector - элементы красного цвета

№1513-01-2014 01:03:14

Re: DOM Inspector - элементы красного цвета

№1613-01-2014 19:50:40

Re: DOM Inspector - элементы красного цвета

№1715-01-2014 01:09:49

Re: DOM Inspector - элементы красного цвета

Board footer