2010-11-12 8 views
7

En esta página http://blog.zacharyvoase.com/2010/11/11/sockets-and-nodes-i/, ejecutar el siguiente código en la consola javascript generará una excepción.Excepción de DOM al asignar entidades HTML a innerHTML

var div = document.createElement('div'); div.innerHTML = "»"; 
  • Chrome 8.0.552.28 Mac: Error: INVALID_STATE_ERR: DOM Excepción 11
  • Firebug en Firefox 3.6.12 Mac: NS_ERROR_DOM_SYNTAX_ERR una cadena no válida o ilegal se especificó
  • Safari 5.0.2 Mac: error: NO_MODIFICATION_ALLOWED_ERR: DOM Excepción 7
    Opera: funciona bien

Pero funciona bien en todas las demás páginas que he probado. Mis preguntas son lo que tiene de especial la página y ¿por qué Chrome y Firefox lanzan una excepción?

Escribir el carácter directamente sin usar la entidad funciona bien.

var div = document.createElement('div'); div.innerHTML = "»"; 

El uso de otras entidades también funciona, p.

var div = document.createElement('div'); div.innerHTML = "<"; 
+0

¿Qué versión de cromo? No veo ninguno, pero estoy en Chrome 9.0 dev. – theazureshadow

+0

No veo ningún error en Firebug tampoco ... –

+0

Gracias. He agregado información de la versión a la descripción. – Arrix

Respuesta

16

Estoy respondiendo a mi propia pregunta.

La respuesta corta: es debido a la limitación del navegador.

Si ciertos navegadores reconocen una página como XHTML, solo se admite un subconjunto de entidades de caracteres con nombre permitidas por el estándar para la asignación de HTML interno.

Específicamente en mis pruebas, parece que en Mozilla y WebKit, solamente ", &, < y > están permitidos en la asignación innerHTML.

Mi código de prueba está disponible aquí: https://gist.github.com/673901

XHTML es una y la versión "mejor" limpiador de HTML reformulado en XML. Se suponía que XHTML 1.1 sería el sucesor y futuro de HTML. Sin embargo, es poco probable que esto suceda con la adopción de HTML5.

A diferencia de HTML, que requiere un analizador HTML dedicado, un analizador XML general puede analizar un documento XHTML. Al menos en mozilla y webkit, XHTML y HTML pasan por diferentes rutas de código. Es comprensible que la ruta del código HTML sea donde más esfuerzo se realiza y también se prueba mejor porque hay muchos más documentos HTML que XHTML.

Vale la pena señalar que si un documento se reconoce como XHTML está determinado por el tipo MIME efectivo en lugar del contenido del documento.

La conclusión es que si está trabajando con XHTML, asegúrese de convertir entidades con nombre en entidades numéricas (por ejemplo,   -> ) antes de asignar a .innerHTML.

+3

+1, bien hecho para resolverlo usted mismo. –

+0

Tenga en cuenta que HTML5 tiene una serialización tanto HTML como XHTML. Además, innerHTML en XHTML es bastante frágil ahora, pero eso probablemente mejorará con la especificación real de innerHTML en HTML5. – Ms2ger

+0

Lo espeluznante es que si creo un documento HTML desde HTML en ** esa misma página ** ('document.documentElement.innerHTML') obtengo este error también. –

1

Parece como si se está a la espera de que se está intentando agregar HTML codificada pero está detectando como formato incorrecto.
¿ var div = document.createElement('div'); div.innerHTML = "»"; hace lo que necesita?

Por Comentario: var dv = document.createElement('div'); dv.innerHTML = "»"; document.getElementById('test').appendChild(dv);

que tiene el carácter codificado here.

Tiene razón acerca de » siendo HTML codificado válido. Solo puedo adivinar que es una limitación del navegador.

+0

Lo que intento hacer es div.innerHTML = "» ", que funciona bien. Sin embargo, me pregunto por qué se lanza una excepción porque creo que la entidad html es válida. – Arrix

+0

ver la edición anterior. – Laramie

Cuestiones relacionadas