2010-10-11 2 views
8

Мне нужно получить фактический html-код элемента на веб-странице.Используйте javascript для получения необработанного кода html

Например, если фактический HTML-код внутри элемента "How to fix"

Запуска этой JavaScript getElementById («MYE»). InnerHTML дает мне "How to fix", который декодированному

Как я могу получить "How to fix" используя javascript?

+1

Правильное свойство Javascript - 'innerHTML', а не' innerHtml' – romaintaz

+0

Убедитесь, что когда вы показываете строку из 'getElementById ('myE'). InnerHtml', то это не переучитывается как HTML, показывая неразрывный космический код. –

ответ

4

То, что вы должны работать:

Элемент тест:

<div id="myE">How to&nbsp;fix</div>​ 

тест JavaScript:

alert(document.getElementById("myE​​​​​​​​").innerHTML); //alerts "How to&nbsp;fix" 

You can try it out here. Удостоверьтесь, что везде, где вы находитесь , используя, результат не показывает &nbsp; как пространство, что, вероятно, так. Если вы хотите показать его где-то, что предназначено для HTML, вам нужно его избежать.

+3

Это работает только для некоторых объектов. Ссылки на объекты типа '& eacute;' не отображаются в 'innerHMTML'; вместо этого появляется символ, обозначаемый как 'é'. –

17

Вы не можете получить код HTML-код части вашей веб-страницы.

Когда вы даете веб-браузер HTML-страницу, он анализирует HTML-код на некоторые узлы DOM, которые являются окончательной версией вашего документа, насколько это касается браузера. DOM хранит значительную информацию из HTML-подобного, что вы использовали символ Unicode U + 00A0 Non-Breaking Space перед словом fix, но не несущественную информацию, которую вы использовали с помощью ссылки на сущность, а не просто набрав ее raw ( ).

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

В частности,

  • имена элементов могут быть или прописными в нижнем регистре;

  • Атрибуты могут отличаться от того, который вы указали в HTML;

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

  • он может не использовать ссылки на объекты для чего угодно, кроме символов, которые в противном случае невозможно было бы включить непосредственно в текстовое содержимое: амперсанды, менее-thans и атрибутные значения-кавычки. Вместо возврата &nbsp; он может просто дать вам сырой знак  .

Вы не можете быть в состоянии видеть , что это неразрывный пробел, но это все еще один и если вставить этот HTML в другой элемент будет действовать как единое целое. Вы не должны полагаться на любом неразрывный пробел является маскирование в &nbsp; ... если вы по какой-то причине, вы можете получить, что при этом:

x= el.innerHTML.replace(/\xA0/g, '&nbsp;') 

но это только избежать U + 00A0, а не любые другие тысячи возможных символов Юникода, так что это немного сомнительно.

Если вы действительно должны получить реальную исходную вашу страницу HTML, вы можете сделать XMLHttpRequest на свой собственный URL (location.href) и получить полный неанализируемый источник HTML в responseText. Для этого почти никогда нет веских оснований.

+1

Хороший материал @bobince. Я нашел смешную версию для вашей идеи XMLHttpRequest. Я работаю с [ polyfill] (https://github.com/scottjehl/picturefill), а IE9 _helpfully_ лишает дочерних элементов из DOM. Получение unparsed HTML делает трюк. – Pat

Смежные вопросы