Как получить содержимое <noscript>в Javascript в IE7? - PullRequest
27 голосов
/ 26 ноября 2010

Я пытаюсь получить содержимое тега <noscript>, используя Javascript.Я успешно смог получить его в FF, Chrome, Opera и даже IE6, но потерпел неудачу в IE7 (еще не пробовал IE8 +).

По сути, вот сокращенная версия кода:

<noscript>Lorem ipsum</noscript>
<script>
    var noscript = document.getElementsByTagName('noscript')[0];
    noscript.textContent; // undefined
    noscript.innerHTML; // empty string
    noscript.childNodes.length; // 0
</script>

Я попытался добавить элемент внутрь и нацелить их, но безуспешно.Я попытался обернуть родительский элемент и получить его .innerHTML, но все, что находится между тегами <noscript>, отбрасывается.

Примечание: я создаю скрипт lazyloader, а элемент <noscript> - это то, что яПотребность (<img> src атрибуты внутри тега <noscript> не выбираются браузером.)

Ответы [ 9 ]

25 голосов
/ 29 ноября 2010

В IE 7 и 8 просто невозможно получить содержимое элемента <noscript>. Любое содержимое между тегами <noscript> и </noscript> в HTML не отражается в DOM в IE, элемент не имеет дочерних элементов, а innerHTML и innerText являются пустыми строками.

В IE 6 ситуация любопытна: как и в IE 7, элемент <noscript> не имеет дочерних узлов, но его содержимое отражено в свойствах innerHTML и outerHTML (но не innerText) элемент.

Все это имеет место, ваша единственная возможность в IE - поместить содержимое вашего элемента <noscript> внутрь какого-то другого элемента. Чтобы эмулировать поведение элемента <noscript>, вы можете поместить содержимое в элемент, который немедленно скрыт JavaScript (когда скрипт включен):

<div id="noscript">Lorem ipsum</div>
<script type="text/javascript">
    document.getElementById("noscript").style.display = "none";
</script>
4 голосов
/ 17 ноября 2011

Не самое элегантное решение - изображения загружаются как обычно с IE7 и IE8, и все другие браузеры получают дополнительное преимущество от отложенной загрузки. В конечном итоге вы получите несколько пустых блоков комментариев ... но кого это волнует, верно?

<!--[if (gt IE 8)|!(IE)]><!--><noscript><!--<![endif]-->
  <img src="/path/to/img.jpg" alt="photo" />
<!--[if (gt IE 8)|!(IE)]><!--></noscript><!--<![endif]-->

JavaScript (jQuery - если вам нужен настоящий JS, дайте мне знать):

jQuery(function($) {
  $('noscript').each(function() {
    var $this = $(this);
    $this.replaceWith($this.text());
  });
});

Протестировано с IE7 +, Chrome, FF3.6 +, Opera11

2 голосов
/ 26 ноября 2010

Чтобы обойти это, нужно продублировать содержимое noscript в качестве его атрибута.

Например:

<noscript id="ns" alt="Lorem ipsulum">Lurem ipsulum</noscript>

В скрипте получите значение атрибута alt вместо его innerHTML

<script>
   var ns = document.getElementByid('ns');
   var htm = ns.innerHTML || ns.getAttribute('alt');

   alert(htm);

</script> 
1 голос
/ 06 июля 2012

Вы можете получить доступ к свойству noscript tag textContent в большинстве современных браузеров.Для старых браузеров я написал polyfill, который работает довольно быстро и во всех настольных и мобильных браузерах, которые я мог протестировать.

Просмотр сообщения в блоге: http://queryj.wordpress.com/2012/07/06/read-noscript-tag-content-reliably-in-all-browsers/

Просмотр кода (Двойная лицензия по лицензиям MIT и GPL): https://github.com/jameswestgate/noscript-textcontent/

РЕДАКТИРОВАНИЕ:

Сценарий работает путем перезагрузки страницы с помощью ajax-запроса (который должен быть кэширован в браузере) и синтаксического анализа содержимого для браузеров, которые не поддерживают свойство textContent

1 голос
/ 09 февраля 2011

Вы можете

<script>document.write('<script id="images" type="text/html">')</script>

непосредственно перед изображениями, а затем

<script>document.write('</scr'+'ipt>')</script>

после него.У вас будут изображения, доступные без javascript, а с помощью JavaScript вы сможете получить их источники в $ ('images'). InnerHTML

0 голосов
/ 10 марта 2014

У меня другой подход, с рабочим примером этого здесь: https://github.com/jokeyrhyme/noscript.js/blob/c104c480b595278e9d559aaf8a26668b7c852f72/noscript.js#L25

Мой подход прост:

  1. выполнить XHR для загрузки необработанной копииоригинальный HTML
  2. найти все элементы noscript в DOM
  3. найти все элементы noscript в исходном HTML
  4. заменить ноды скриптов DOM содержимым оригинальных noscript

Мой метод noscript.show() проверяет, нужно ли это в первую очередь.Для большинства браузеров он просто перемещает содержимое элементов noscript так, чтобы они были видны.

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

Примечание: из-за правила Same-Origin, у вас могут возникнуть проблемы при использовании этой техники при просмотре файлов на локальном диске черезfile:///..., поэтому он может работать только при просмотре через http://... или https://....

0 голосов
/ 06 декабря 2010

Это действительно грязный хак, и он полностью не проверен, но у меня просто возникла идея: D

Вы можете сделать, как предлагали другие, поместить содержимое в div, а не в noscript, и в дополнение кскрывая это, немедленно удалите атрибут src всех тегов img, используя что-то с эффектом:

jQuery(function () { 
    jQuery('div#noscript img').attr('src', '');
  });

Это должно ограничить (но не устранить) выборку изображений.

Это всего лишь основано на комментариях и предложениях других, надеюсь, это поможет.


Редактировать - еще один грязный хак, о котором я только что подумал, который предполагает, что вы можете изменить место HTMLживет, поэтому может или не может иметь значение:

Внутри noscript есть

<iframe width="100%" height="100%" src="?noscript=true" />

, тогда вы можете XMLHttpRequest для содержимого noscript ...

0 голосов
/ 02 декабря 2010

В данный момент у меня нет браузера ie;), насколько я помню, содержимое тега <noscript> доступно, когда вы получаете родительский тег .innerHTML(). Тогда вам нужно вытащить это (с неприятным регулярным выражением, например)

Я не могу проверить его как минимум в течение 7 часов, поэтому я публикую эту информацию как есть.

PS. Мой совет - переделать. Теги Noscript должны содержать содержимое, которое НЕ используется при включенных сценариях.

0 голосов
/ 29 ноября 2010

Вы запрашиваете элементы скрипта вместо элементов noscript, Это работает во всех браузерах:

<noscript>Lorem ipsum</noscript>
<script>
    var noscript = document.getElementsByTagName('noscript')[0];
    alert(noscript.innerHTML); // Lorem ipsum
</script>
...