javascript - 为不同的浏览器加载不同的模板文件

Question

我想为不同浏览器加载不同模板文件的页面。

示例:

如果浏览器是IE，则加载1.tpl

& 如果浏览器不是 IE，则加载 2.tpl

[这里.tpl是具有各自内容和CSS的模板文件]

我尝试使用条件标签:

<!--[if IE]>
{include file="/templates/1.tpl"}       
<![endif]-->

<!--[if !IE]>-->
{include file="/templates/2.tpl"}   
<!--<![endif]-->

使用这些条件标签，其他浏览器可以正常工作。但 IE 仍然从 .tpl 获取内容文件导致页面困惑。

所以我就这样把戏......

<!--[if IE]>
{include file="/templates/1.tpl"}  
<![endif]-->

<div id="container">
{include file="/templates/2.tpl"}  
</div>

<script type="text/javascript">
var IE = /*@cc_on!@*/false;
if(IE){
   $("#container").css("display","none");
}
 </script>

在前端，这显示了我需要的内容，

但是在后端 IE 仍然需要处理 both.tpl 的内容和 css然后隐藏其中一个。

这会导致加载时间和Javascript冲突。

我知道这些都是我玩过的肮脏伎俩。

有没有更好的方法来做到这一点？

谢谢。

编辑:

{include file="/templates/2.tpl"} 是模板自定义文件中使用的 smarty 标签。

Answer 1

您的“非 IE”条件注释不正确 ( reference )。尝试:

<!--[if IE]>
{include file="/templates/1.tpl"}       
<![endif]-->

<![if !IE]>
{include file="/templates/2.tpl"}   
<![endif]>

请注意，“not”版本不使用!-- 形式。

但正如 David 所说，更好的方法是使用符合标准的单个模板，并且对 IE 的怪癖有最低限度的认可，并且如果有必要，还可以包含一个额外的模板，通过一些额外的功能来增强它IE 的代码。这尤其是因为自从 smarty 标签在服务器端被替换后，您总是会最终将两个模板发送到所有浏览器，只是其中一个被注释掉，这似乎很浪费......