2011-01-14 18 views
9

La página en cuestión tiene html muy esquelético enviado a través del cable para facilitar la construcción de una interfaz de usuario complicada en javascript.¿Cómo se valida html que se genera a partir de JS ejecutándose en el navegador?

Ahora me encuentro con un extraño problema de compatibilidad del navegador que se siente como si tuviera un problema de marcado en algún lugar de la página.

He validado la página, ya que viene a través del cable con la herramienta W3C y se aseguró de que no haya problemas en ese html. También he intentado validar la salida de la consola que se ejecuta en el navegador:

document.getElementsByTagName('html')[0].outerHTML 

me parece que la salida de la anterior introduce una gran cantidad de nuevos problemas, como la eliminación del terminador '/' en las etiquetas de cierre automático. Este ruido adicional distrae, pero también me inquieta la validación de este método.

¿Cómo se valida el marcado que se entrega al lado del cliente?

+0

'¿Cómo se valida el marcado que se muestra en el lado del cliente?' No. Solo oras para que funcione. :) * Muy * buena pregunta sin embargo! No conozco ningún validador que haga esto. –

+3

Cuéntanos sobre ese extraño problema de compatibilidad. –

+0

Los navegadores no son validadores: lea el HTML interno de cualquier xhtml cuidadosamente marcado y verá que los navegadores ignoran las barras inclinadas, omite algunas etiquetas de cierre y quita las comillas y cambia de mayúsculas hasta que las páginas propias de la madre no lo reconozcan. – kennebec

Respuesta

1

Cuando los elementos se crean en el cliente, son creados correctamente por el navegador; realmente no hay nada que validar. La única vez que necesitaría validar cualquier marcado es si realmente está asignando outerHTML/innerHTML = some markup from the server. Si ese es el caso, simplemente cierre la sesión de los resultados en su servidor y ejecútelos a través de los validadores de HTML estándar.

+0

o léelo ... si lo hace extensamente, probablemente tenga problemas más grandes que resolver que la validación incompleta de html. – Louis

+0

Pero incluso si los elementos en sí mismos se crean correctamente, es posible que no se aniden correctamente, o pueden ser atributos obligatorios faltantes Por ejemplo, en HTML 4, la etiqueta debe tener alt especificado. ¿Cómo averiguo si accidentalmente lo olvidé en alguna parte? –

0

El navegador analiza los documentos HTML en una representación DOM - el código de marcado no se conserva. Cuando crea/modifica elementos a través de Javascript, también se crean a través del DOM (o se analizan en objetos DOM, si se utiliza la asignación innerHTML/outerHTML). Por lo tanto, no hay nada que validar, en realidad, ya que su página generada por Javascript no se almacena como marcado para comenzar.

Recuperando HTML a través de innerHTML/outerHTML hace que el navegador lo reconvierta, y los navegadores aún lo hacen generalmente con sintaxis HTML, no estrictamente con sintaxis XHTML (por ejemplo, con respecto a las etiquetas de cierre automático).

En cuanto a resolver el problema de renderizado (o tal vez un CSS desordenado/pasado de alto, por ejemplo), podría considerar usar Firebug o las Herramientas de desarrollador de Chrome (o Firebug Lite para navegadores distintos de Firefox y Chrome). le permite inspeccionar la estructura y los elementos del documento, seleccionar elementos y ver qué reglas de CSS se les aplican e inspeccionar visualmente el modelo de la caja. Puede ayudarte a identificar dónde está tu problema.

Y por si acaso, ¿tiene una declaración DOCTYPE válida? El modo Quirks puede hacer cosas extrañas.

+0

'innerHTML/outerHTML no es una buena práctica' ¿por qué es eso? Es más rápido agregar elementos uno tras otro al DOM (tiempo de programación y procesamiento). Recuerde que los navegadores son realmente buenos para analizar HTML, ya que es su tarea principal. – Thomas

+0

porque en IE no tienes Firebug para ver qué está pasando. La barra de herramientas para desarrolladores de IE es horrible, y Firebug lite no existe. – Louis

+0

@jim: De hecho, falta Firebug Lite, aunque es mejor que intentar solucionar un problema a ciegas, especialmente con código generado por Javascript. @Thomas: Honestamente, es algo que me dijeron y leí brevemente, pero si encontré alguna justificación que no recuerdo. Mi intuición dice que es más desordenada y propensa a errores (dependiendo de dónde se inserte el código HTML), y el DOM está destinado a dichos accesos/modificaciones. Al parecer, tampoco es un estándar W3C, aunque es compatible con los principales navegadores. Eso y la velocidad a un lado, si hay algo más que decir a favor o en contra, estaría feliz de escucharlo. – Laogeodritt

0

Si desea validar una página, ¿por qué no acceder a ella, ver el código fuente, copiarla y validarla con la entrada directa? Lleva 3 clics más que la validación normal, pero ... La otra forma es alojarlo en alguna parte y validar desde allí.

Cuestiones relacionadas