jQuery $ ("<script></script>"). appendTo ("голова");не отображается в ОБЩЕМ исходном коде.КАК? - PullRequest
Новая
       6

jQuery $ ("<script></script>"). appendTo ("голова");не отображается в ОБЩЕМ исходном коде.КАК?

2 голосов
/ 05 августа 2011

Ну, это на самом деле не проблема, но что-то меня действительно интересует.

Обычно мы добавляем элементы к голове / телу как 

$("<style><\/style>").appendTo("head");
$("<div><\/div>").appendTo("body");

И когда мы смотрим на сгенерированный источниккод, эти элементы действительно есть.но 

$("<script><\/script>").appendTo("head");

Элемент script не отображается в исходном коде.

Я просмотрел исходный код jQuery и не нашел ничего особенного, кроме чистого javascript 

append: function() {
    return this.domManip(arguments, true, function( elem ) {
        if ( this.nodeType === 1 ) {
            this.appendChild( elem ); // <--
        }
    });
},

Если я использую чистый Javascript для добавления элемента script в заголовок, он будет отображаться.

Так как же jQuery делает это, чтобы сделать скрипт "невидимым" и в то же время "доступным"??
Что особенного в теге скрипта?

обновление: обратите внимание, прежде чем ответить

  • Я не пытаюсь решить проблему.
  • Я используюИнструменты Firebug / Developer.
  • Я просматриваю ОБЫЧНЫЙ исходный код.

Ответы [ 4 ]

1 голос
/ 05 августа 2011

Это не относится исключительно к appendTo, как вы могли бы сначала поверить.Скорее это то, что jQuery делает для всех своих функций, которые вставляют произвольные строки HTML в DOM.

Чтобы увидеть подробный ответ о том, почему это происходит, прочитайте статью Джона Резигаответ на этот же вопрос здесь .

Из того, что я знаю, jQuery фактически удаляет тег script после вставки его в DOM, чтобы избежать повторного выполнения кода.

0 голосов
/ 13 мая 2012

Хотя я вижу, что на этот вопрос уже есть ответ, я решил добавить примечание к тому, что нашел ...

Я столкнулся с чем-то похожим: я составлял список содержимого, содержащий ссылки на каждый из моих элементов h1, h2, h3 на моем веб-сайте. Содержание будет распространяться на все страницы сайта и будет включено на отдельной странице. Вместо того, чтобы создавать это вручную, я объединил все страницы, а затем использовал jquery для быстрого создания динамического упорядоченного списка гиперссылок на каждый заголовок.

Затем я собирался скопировать и вставить этот код на свою страницу и сделать его доступным. Проблема, с которой я столкнулся в Firefox, заключалась в том, что код не отображался в окне «Просмотр исходного кода», а только при проверке Firebug. окно HTML элемента - так как я мог скопировать его?

Я обнаружил, что если бы я использовал инструменты разработчика IE, я мог бы использовать опцию HTML Edit в их разделе для разработчиков, чтобы скопировать и вставить код из окна проводника их элементов.

Вероятно, есть лучший способ создать большую вложенную таблицу со списком содержимого ссылок на каждый h1, h2, h3 ... h7, но я новичок во всем этом и пошел по этому пути. Может быть, это кому-то поможет :)

0 голосов
/ 05 августа 2011

Опция «Просмотр исходного кода» в большинстве браузеров показывает только то, как выглядела разметка при начальной загрузке страницы.Поскольку вы манипулируете DOM после загрузки страницы, эти изменения не видны, когда вы «просматриваете источник».

Некоторые инструменты веб-разработчика, такие как Firebug (для Firefox) или панель инструментов разработки IE (ИнтернетПроводник) покажет вам управляемую разметку, позволив вам осмотреть элементы.

0 голосов
/ 05 августа 2011

Попробуйте это 

<script>
$("<scri"+"pt></sc"+"ript>").appendTo("head");
</script>

Вы должны "убежать" от своего кода, иначе браузер распознает его как конец вас <script>

...