"[! IE]" условные комментарии в Haml

В документе HAML у меня есть:

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

Первое условие правильно оценивается в IE (и, предположительно, в Firefox и Chrome, так как "This is IE" не отображается в этих браузерах). Тем не менее, второе условие, похоже, не оценивается должным образом в Firefox или Chrome, поскольку "Это не IE" не отображается.

Я предполагаю, что я сделал что-то не так. Любые идеи?

Ответы

Ответ 1

При использовании условных комментариев IE существуют два разных типа, о которых вам нужно знать. Во-первых, когда весь контент находится внутри комментария HTML (между <!-- и -->), но IE будет читать его из-за условия:

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

Другой тип - это не один комментарий, а некоторый контент, который будут видеть браузеры, окруженный двумя комментариями, которые заставят IE игнорировать его:

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

(выделение кода SO показывает разницу - в верхней части все серые, как и все комментарии, но в этом текст темнее, поскольку это не комментарий).

Поддержка Haml для условных комментариев IE полезна только для создания первого рода, поскольку она является частью синтаксиса для создания комментариев блока. Если вы попробуете использовать его для второго типа (как у вас здесь), вы получите что-то вроде:

<!--[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]-->

который фактически является безусловным комментарием.

Чтобы использовать тип [if !IE] в Haml, вам, вероятно, придется сделать это вручную:

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

Вы также можете использовать помощник Haml surround, например:

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

(Если вы используете Rails, вам нужно использовать html_safe для строк, т.е. surround '<!--[if !IE]> -->'.html_safe, '<!-- <![endif]-->'.html_safe do).

Если вы используете это много, возможно, стоит создать вспомогательный метод, который переносит этот вызов на surround.

Ответ 2

для списка условий:

!!!
: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

Ответ 3

Я делаю приложение rails, и я нашел проблему с битом, следуя тому, что @matt предложил в его ответе, я нахожу ниже проблемы:

HAML

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

Вот как браузер отображает HTML (без конца тега в конце и добавляет его при объявлении самой строки)

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

Итак, вот код, который отлично работает для меня.

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

Ответ 4

Ответ был дан, но для тех, кто ищет версию TL; DR:

/[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.