26

在jade中，我想根据这个方法放入一个有条件的html标签，它放入

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class=""> <!--<![endif]-->

在 html 文件的顶部。

我试过

//[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]
//[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]
//[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]
//[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]
  head
    ...

但是jade忽略了html标签，并且没有写在end</html>标签中。这是无效的 html，并导致 IE 根本不显示任何内容。

有什么办法吗？

我想如果没有办法，我只会使用 javascript 解决方案。

4

7 回答 7

21

此方法适用于结束 html 标记： 

!!! 5
//if lt IE 7
    <html class="no-js lt-ie9 lt-ie8 lt-ie7">
//if IE 7
    <html class="no-js lt-ie9 lt-ie8">
//if IE 8
    <html class="no-js lt-ie9">
// [if gt IE 8] <!
html(class="no-js", lang="en")
    // <![endif]
    head
        title= title

    body!= body

来自：https ://gist.github.com/kmiyashiro/1140425#comment-675550

更新：

正如kumar-harsh所指出的，这种行为现在已经被贬低了，如果你需要这个功能，你现在应该使用常规的 html：

<!--[if IE]>
  <html class="ie">
<![endif]-->
<![if !IE]>
  <html class="not-ie">
<![endif]>
</html>

来自：https ://github.com/visionmedia/jade/issues/1345?source=cc#issuecomment-31920732

于 2012-05-07T18:22:43.747 回答
17

这就是您要查找的内容，它还将提供结束 html 标记。

!!! 5
//[if lt IE 7]><html lang="en" class="no-js oldie lt-ie9 lt-ie8 lt-ie7"><![endif]
//[if IE 7]><html lang="en" class="no-js oldie lt-ie9 lt-ie8"><![endif]
//[if IE 8]><html lang="en" class="no-js oldie lt-ie9"><![endif]
//[if gt IE 8]><!
html(class='no-js', lang='en')
  //<![endif]
  head
于 2013-01-07T14:39:10.650 回答
11

只需使用此语法，注意不同的缩进：

!!! 5
| <!--[if lt IE 7]> <html class="ie6 oldie" lang="en"> <![endif]-->
| <!--[if IE 7]>    <html class="ie7 oldie" lang="en"> <![endif]-->
| <!--[if IE 8]>    <html class="ie8 oldie" lang="en"> <![endif]-->
| <!--[if gt IE 8]><!--> <html lang="en"> <!--<![endif]-->
head
  …
于 2011-10-25T18:37:56.520 回答
8

在版本中1.0.0（2013 年12 月 22 日发布）Jade 不再解析评论内容，并且已删除对 IE 条件评论的支持（//if lt IE 7在版本及以下版本中将不起作用0.35.0）。

新方法是使用格式良好的 IE 条件注释。因此，为了生成上述 IE 条件注释，Jade 模板必须如下：

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
html(class="") 
  <!--<![endif]-->
  ...

请注意，前四个html元素是格式良好的 HTML 元素。最后一个使用 Jade 语法。最后的评论<!--<![endif]-->也必须缩进。

<在 Jade 1.0.0 及更高版本中，使用 HTML 注释是安全的，因为 Jade 将忽略任何以字符开头的行。

您还可以访问Jade 中的 IE Con​​ditional Comments 上的这篇文章，其中讨论了 Jade 版本0.35.0和1.0.0. 它还展示了使用 Jade mixins 机制进行条件注释的替代方法。

于 2014-01-22T02:07:55.403 回答
3

从版本 1.0.0 开始，// if构造不再是神奇的。逐字呈现 HTML（任何以 < 开头的行都由 Jade 按原样传输）或使用 mixin，根据另一个答案中引用的Tom 的博客：

mixin ie(condition)
    | <!--[!{condition}]>
    block
    | <![endif]-->

doctype html
html
  head
    title= My title
    +ie('if IE 8')
      link(rel='stylesheet', href='/stylesheets/style-ie8-1.css')
于 2014-06-06T15:55:29.707 回答
1

非常简单。

示例：

HTML

<!--[if lt IE 7 ]><html class="ie ie6" lang="en"><![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"><![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->

玉

//[if lt IE 7]>
  <html class="ie ie6" lang="en"> <![endif]
//[if IE 7]>
  <html class="ie ie7" lang="en"> <![endif]
//[if IE 8]>
  <html class="ie ie8" lang="en"> <![endif]
于 2015-09-04T14:20:22.083 回答
-5

据我所知，您不能将这样的 html 标签放在玉中。为此，您需要包含一个 html 或在支持以下文本的标签中使用尾随 (.)：

p. <html><script></script>....

所以 html 标签不支持文本，所以你不能这样做。另一个解决方案是：

-if IE==6
    html.ie6
-if IE==7
    html.ie7
-if IE==8
    html.ie8
-if IE==9
    html.ie9
  head
  body
      h1 My sit
于 2011-10-13T17:55:42.793 回答