30 votes

Commentaires conditionnels "[ !IE]" dans Haml

Dans un document HAML, j'ai :

/[if IE]
  This is IE
/[if !IE]
  This is not IE

La première condition s'évalue correctement dans IE (et vraisemblablement dans Firefox et Chrome, car "This is IE" n'est pas rendu dans ces navigateurs). Cependant, la deuxième condition ne semble pas s'évaluer correctement dans Firefox ou Chrome, car "This is not IE" n'est pas rendu.

Je suppose que j'ai fait quelque chose de mal. Vous avez des idées ?

92voto

matt Points 33799

Lorsque vous utilisez les commentaires conditionnels d'IE, il existe deux types différents dont vous devez être conscient. Premièrement, lorsque l'ensemble du contenu se trouve à l'intérieur d'un commentaire HTML (entre <!-- y --> ), mais l'IE le lira à cause de son état :

<!--[if IE]>
  This is inside a HTML comment, so most browsers will ignore it, but IE will
  interpret it.
<![endif]-->

L'autre type est pas un seul commentaire, mais du contenu que les navigateurs verront, entouré de deux commentaires qui feront qu'IE l'ignorera :

<!--[if !IE]> -->
  This is not a HTML comment, so browsers should see it, but IE will ignore it.
<!-- <![endif]-->

(La mise en évidence du code de SO montre la différence - dans la première, tout est gris car il s'agit d'un commentaire, mais dans celle-ci, le texte est plus foncé car il ne s'agit pas d'un commentaire).

Le support Haml pour les commentaires conditionnels IE n'est utile que pour créer le premier type, car il fait partie de la syntaxe de création des commentaires de bloc. Si vous essayez de l'utiliser pour le second type (comme vous l'avez fait ici), vous obtenez quelque chose comme.. :

<!--[if !IE]>
  This is inside a HTML comment, so other browsers will ignore it.
  IE will also ignore it, as the conditional states !IE.
  So everything ignores it.
<![endif]-->

ce qui constitue effectivement un commentaire inconditionnel.

Afin d'utiliser le [if !IE] en Haml, vous devrez probablement le faire manuellement :

%p Some other content
<!--[if !IE]> -->
%p
  Here's some content that shouldn't appear in IE.
<!-- <![endif]-->

Vous pouvez également utiliser le Haml surround aide comme ceci :

%p Some other content
=surround '<!--[if !IE]> -->', '<!-- <![endif]-->' do
  %p
    Here's some content that shouldn't appear in IE.

(Si vous utilisez Rails, vous devrez utiliser html_safe sur les cordes, c'est-à-dire surround '<!--[if !IE]> -->'.html_safe, '<!-- <![endif]-->'.html_safe do ).

Si vous l'utilisez souvent, il peut être utile de créer une méthode d'aide qui englobe cet appel à la fonction surround .

2voto

chris raethke Points 191

J'ai fini par utiliser un filtre :plain, comme vous pouvez le voir ici. Gist

https://gist.github.com/3031540

1voto

miukki Points 101

Pour la liste des conditions :

!!!
:plain
  <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]--><!--[if IE 7]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]--><!--[if IE 8]><html class="no-js lt-ie9" lang="en"> <![endif]--> <!--[if IE 9]><html class="no-js lt-ie10" lang="en"> <![endif]--> <!--[if gt IE 9]><!-->
%html.no-js{:lang => 'en'}
  / <![endif]

  %head
    %title Yinlang

1voto

Seth Jeffery Points 216

On a répondu à cette question, mais pour ceux qui recherchent la TL;DR version :

/[if IE]
  This will only be rendered in IE

/[if lte IE 8]
  This will only be rendered in IE 8 or less

= surround '<!--[if !IE]> -->'.html_safe, '<!-- <![endif]-->'.html_safe do
  This will only be rendered in NON-IE browsers.

0voto

Syed Points 392

Je fais une application rails et j'ai trouvé un petit problème en suivant ce que @matt a suggéré dans sa réponse, je trouve les problèmes ci-dessous :

HAML

!!!
= surround '<!--[if !IE]> -->'.html_safe, '<!-- <![endif]-->'.html_safe do
  %html.no-js{:lang => 'en'}
  %head
  %body

Voici comment le navigateur rend le HTML (sans balise de fin à la toute fin et l'ajoute à la ligne de déclaration elle-même)

<!DOCTYPE html>
<!--[if !IE]> --><html class='no-js' lang='en'></html>
<head>..</head>
<body>..</body>

Voici donc le code qui fonctionne bien pour moi.

!!!
:plain
  <!--[if !IE]><!-->
%html.no-js{:lang => 'en'}
  / <![endif]

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X