HTML标签中的条件格式

Question

有没有在HTML标签中使用IF-ELSE调节的选项

 <if true>  do something   </if>  
 <else>     do something   </else>

Answer 1

有，但它实际上只用于IE来区分不同的版本：

<!--[if IE6]>
    Things here!
<![endif]-->

Answer 2

不是迂腐，但HTML是一种标记语言，对条件逻辑没用。

话虽这么说，听起来你正在寻找的是一些javascript。 如果您可以在问题中添加更多细节，我可以详细说明如何使用javascript来执行条件逻辑任务。

Answer 3

HTML是为文档布局而设计的，因此noscript和noframe几乎与HTML处理条件一样接近。 你可以想象用javascript来解决这个问题。

<div id='if-part' style='visibility: hidden;'>do something</div>
<div id='else-part' style='visibility: hidden'>do something</div>

<script>
    var node;
    if(true) {
        node = document.getElementById('if-part');
    }
    else {
        node = document.getElementById('else-part');
    }
    node.style.visibility = 'visible';
</script>

当然这仅在客户端启用了javascript时才有效。

Answer 4

HTML的条件呈现不是一个新概念，但不能仅使用HTML来完成。 您需要使用客户端脚本或服务器端代码来提供相应地呈现HTML的条件逻辑。

Answer 5

你有没有人编写过电子邮件？ 你的所有java脚本都被google剥离了。 此外，Android上的gmail不支持媒体查询，不同版本的Outlook也有自己的怪癖。 如果您想要在各种电子邮件客户端上呈现良好的电子邮件，您别无选择，只能使用条件HTML。

这很像第二个例子：

<!--[if gte mso 9]>
    <style type="text/css">
    /* Your Outlook-specific CSS goes here. */
    </style>
<![endif]-->

但是，如果您没有通过电子邮件客户端，我将不得不同意其他人并说您应该使用Java Script。

Answer 6

正如在其他帖子中所说，HTML不支持条件逻辑。 你有两个选择：

1）使用PHP或XSLT等技术动态生成HTML

2）使用Javascript后修改HTML DOM

Answer 7

在确认Kevin Loney及其javaScript解决方案后，我们还应该考虑CSS条件。 如果条件基于浏览器感知/响应式设计，则可以绕过javaScripting：

<div class='if-part'>show something</div>
<div class='else-part'>show something</div>

从某种意义上说“显示某种东西”，你只会隐藏不适用的条件。 在下面的示例中，“if-part”仅显示在移动设备上。 “else-part”显示在较大的屏幕上。

@media screen and (max-width:767px){
    .if-part{display:initial;}
    .else-part{display:none}
}
@media screen and (min-width:768px){
    .if-part{display:none;}
    .else-part{display:initial}
}

这个答案提供了更多的CSS选项供您考虑。