2011-09-09 24 views
6

El código siguiente es para fiable cross-browser IE detección de la versiónes decir, los comentarios condicionales necesitan explicación

<!--[if lt IE 7 ]><body class="ie_6"><![endif]--> 
<!--[if IE 7 ]><body class="ie_7"><![endif]--> 
<!--[if IE 8 ]><body class="ie_8"><![endif]--> 
<!--[if IE 9 ]><body class="ie_9"><![endif]--> 
<!--[if (gt IE 9)|!(IE)]><!--> 
<body> 
<!--<![endif]--> 

Lo que no entiendo es, qué es lo normal working.Why <body> no sobrescribir el puesto <body class="ie_9"> es solo una etiqueta normal, debe ser reconocida por todos los navegadores.

¿Cuál es la magia sobre

<!--> 
    <body> 
    <!-- 
+0

Explicó un poco más sobre "la magia" en una edición de mi respuesta, después de que la aceptó, así que solo estoy poniendo esto aquí para asegurarse de que vea :) – Joe

Respuesta

11

Es posible que desee cambiar !(IE) a (!IE)

Además, el "normal" <body> etiqueta que está hablando es de un comentario condicional. El hecho de que esté en una línea diferente no importa, todavía está dentro de la etiqueta de comentario condicional, por lo que se ve afectado como tal.

Comentarios condicionales para el trabajo IE mediante el uso de comentarios HTML normales <!-- --> por lo que cualquier código dentro de un condicional "falso" se acaba de comentar; <!-- <body class="ie6"> --> IE entonces tiene su propia sintaxis dentro de eso. Como tal, los navegadores que no son de IE solo ven una cadena comentada, y IE la trata como una declaración para ejecutar.

Debido a esto, solo se muestra una etiqueta de cuerpo, y solo esa se usa.


Más explicación de

<!--[if (gt IE 9)|!(IE)]><!--> 
<body> 
<!--<![endif]--> 

Para IE, esto dice:

<if greater than ie9, or not ie> (ie conditional comment) 
<!--> (empty comment) (--> putting this here to stop SO ruining syntax highlighting :D) 
<body> 
<end if> (ie conditional comment) 

Si usted no entiende por qué, lea el párrafo que comienza "comentarios condicionales para el trabajo de IE .. . ".

Este mismo bloque, a cualquier otro navegador tiene el siguiente aspecto:

<!--[if (gt IE 9)|!(IE)]><!--> (this is just one comment, containing the text "[if (gt IE 9)|!(IE)]><!") 
<body> 
<!--<![endif]--> (again, just one comment, containing "<![endif]") 
3
<!--[if (gt IE 9)|!(IE)]><!--> 
<body> 
<!--<![endif]--> 

significa: salida de la señal del <body> allí si la versión del navegador es mayor que (gt) IE9 (así, por ejemplo, IE10), o si no es IE.

Dado que IE9 es actualmente la última versión, esta condición no se cumple con ningún IE.

El truco es que --> en la primera línea cerrará el comentario en otros navegadores, por lo que para ellos, <!--[if (gt IE 9)|!(IE)]><!--> es sólo un comentario normales (lo mismo para <!-- en la última línea).

Pero IE analizará <!--[if (gt IE 9)|!(IE)]> y <![endif]-->, y tratará <!--><body><!-- como el contenido del comentario condicional. Lo que significa que si la condición se cumple, genera un comentario vacío, la etiqueta <body> y el comienzo de un comentario.

MSDN tiene una descripción exhaustiva sobre conditional comments.Parece que podría lograr el mismo mediante el uso de reveladas Downlevel comentarios condicionales:

<![if (gt IE 9)|!(IE)]> 
<p>Please upgrade to Internet Explorer version 8.</p> 
<![endif]> 

(aunque no es HTML válido).

+0

'' debería ser solo una etiqueta normal , debe ser reconocido por todos los navegadores, independientemente de la versión o fabricación – wukong

+0

Buena respuesta. Solo para agregar que la razón por la que necesita el adicional '->' y ' chris5marsh

+0

'' es ** NO ** commneted – wukong

Cuestiones relacionadas