2010-10-11 39 views
8

Necesito obtener el código html real de un elemento en una página web.Use javascript para obtener el código html sin formato

Por ejemplo, si el código HTML real en el interior del elemento es "How to fix"

La ejecución de este javascript getElemenById ('RME'). InnerHTML me da "How to fix" que es la forma decodificada

¿Cómo puedo obtener "How to fix" usando javascript?

+1

La propiedad correcta de Javascript es 'innerHTML', no' innerHtml' – romaintaz

+0

Asegúrese de que cuando está visualizando la cadena de 'getElementById ('myE'). InnerHtml' no se reinterpreta como HTML, lo que no da como resultado mostrando el código de espacio no rompible. –

Respuesta

4

Lo que tienes debería funcionar:

elemento de prueba:

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

prueba de JavaScript:

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

You can try it out here. Asegúrese de que sea donde sea que esté usando, el resultado no es &nbsp; como espacio, lo cual es probable. Si desea mostrarlo en algún lugar diseñado para HTML, deberá escapar de él.

+3

Esto funciona solo para algunas entidades. Las referencias de entidades como '& eacute;' no aparecen en 'innerHMTML'; en su lugar, el carácter indicado, como 'é', aparece allí. –

17

No puede obtener real fuente HTML de parte de su página web.

Cuando das un navegador web una página HTML, se analiza el HTML en algunos nodos DOM que son la versión definitiva del documento en lo que se refiere al navegador. El DOM conserva la información significativa del código HTML, como que usaste el carácter Unicode U + 00A0 Espacio sin interrupción antes de la palabra fix, pero no la información irrelevante que usaste por medio de una referencia de entidad en lugar de solo tipearla en bruto ( ).

Cuando le pide al navegador un nodo de elemento innerHTML, no le proporciona el origen HTML original que se analizó para producir ese nodo, porque ya no tiene esa información. En cambio, genera un nuevo HTML a partir de los datos almacenados en el DOM. El navegador decide cómo formatear esa serialización HTML; diferentes navegadores producen HTML diferentes, y es probable que no sea de la misma forma en que lo formateó originalmente.

En particular,

  • nombres de los elementos pueden ser mayúsculas o con carcasa inferior;

  • atributos pueden no estar en el mismo orden en que las que figuren en el HTML;

  • atributo citando puede no ser la misma que en su fuente. IE a menudo genera atributos sin comillas que ni siquiera son HTML válidos; de lo único que puede estar seguro es de que el innerHTML generado será seguro de usar en el mismo navegador escribiéndolo en el elemento innerHTML;

  • no puede usar referencias de entidad para nada excepto caracteres que de otro modo serían imposibles de incluir directamente en el contenido de texto: ampersands, less-thans y attribute-value-quotes. En lugar de devolver &nbsp;, es posible que simplemente le proporcione el carácter   sin formato.

Es posible que no pueda ver que eso es un espacio de no separación, pero aún así es uno, y si inserta que HTML en otro elemento que va a actuar como uno. No debería ser necesario confiar en cualquier lugar de un carácter de espacio de no separación de ser entidad escapado a &nbsp; ... si lo hace, por alguna razón, se puede conseguir que al hacerlo:

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

sino que sólo se escapa U + 00A0 y ninguno de los otros miles de posibles caracteres Unicode, por lo que es un poco cuestionable.

Si realmente realmente necesita para conseguir HTML fuente real de su página, se puede hacer una XMLHttpRequest a su propia URL (location.href) y obtener el código HTML completo, no analizada en el responseText. Casi nunca hay una buena razón para hacer esto.

+1

Cosas buenas @bobince. Encontré un caso de uso ridículo para su idea XMLHttpRequest. Estoy trabajando con un [ polyfill] (https://github.com/scottjehl/picturefill) y IE9 está _helpfully_ pelando los elementos secundarios del DOM. Obtener el HTML sin analizar está haciendo el truco. – Pat

Cuestiones relacionadas