logo标签列表

根据浏览器不同引入不同的JavaScript文件？

javascripthtml
11

如果浏览器不是IE，我想只包含一个JavaScript文件。有没有办法做到这一点？

1
你想要只使用JavaScript来完成这个任务，还是也会使用服务器端的编程语言？ - Chris Thompson
8个回答
14

更新2022年:

以下是一些选项:

  1. 让您的服务器查看 User-Agent 头并向Internet Explorer和其他浏览器发送不同的HTML。

    优点:

    • 无需客户端解决方案。

    缺点:

    • 依赖于 User-Agent 字符串容易出错，并且它们可能被欺骗或完全不存在。

  2. 嗅探 navigator.userAgent 并根据您发现的内容输出一个 script 标记或不输出。

    优点:

    • 无需服务器端要求。

    缺点:

    • 与＃1相同：依赖于 User-Agent 字符串容易出错，并且它们可能被欺骗或完全不存在。
    • 有些人对从代码中输出 script 标签有问题，特别是通过 document.write，但根据您的用例，document.write 可能是不可避免的（例如，在某些其他脚本之前需要该脚本吗等）。

  3. 嗅探JavaScript运行时中只有Internet Explorer具有的某些内容，并根据您发现的内容输出一个 script 标记或不输出。

    优点:

    • 无需服务器端要求。
    • 无需用户代理嗅探。

    缺点:

    • 一些人对动态添加脚本标记有问题。

我可能会看一下第三个。例如，任何一个稍微现代一点的浏览器都有Symbol函数。但是Internet Explorer没有。因此：

if (typeof Symbol !== "undefined") {
    document.write("<script src='./your-non-ie-script.js'><\/script>");
    // Or if you prefer
    let script = document.createElement("script");
    script.src = "./your-non-ie-script.js";
    document.activeElement.parentNode.appendChild(script);
}
< p > Symbol 只是其中一个例子，IE 缺少 ES2015 中现在其他所有内容都有的 Reflect、Proxy 和其他一些功能...

（不确定为什么我在2013年没有提到这一点！）

2013年更新: IE10及以上版本不再支持条件注释。

您可以使用IE的条件注释来实现，方法如下：

<![if !IE]>
<script src="your-non-IE-script.js" type="text/javascript"></script>
<![endif]>

请注意，上述内容由非IE浏览器处理，因为条件语句不是HTML注释，所以中间的部分由非IE浏览器处理。IE看到条件语句并跳过内容，因为它理解条件语句的意思是“不是你，继续前进”。
如果您只想为IE执行某些操作，则使用类似的表单，但使用HTML注释（带有--），因为这是您唯一可以依赖其他浏览器忽略内容的方法。即使它们是评论，IE也知道要注意它们。有关更多信息，请参见上面的链接。
请注意，当您使用条件注释时，IE（而不是其他浏览器）存在页面加载速度的影响（它们会暂时阻止其他资源的下载）。有关更多信息，请参见此处：http://www.phpied.com/conditional-comments-block-downloads/
4
我只想指出那不是一个处理指令，它只是专有的微软语法。一个处理指令应该是这样的形式：<?processing-instruction-name-here ...data here...?>。 - Eli Grey
@Eli：果然是处理指令（http://en.wikipedia.org/wiki/Processing_Instruction）。哇，我一直以为它们是处理指令。谢谢！ - T.J. Crowder
IE 11 加载了 your-non-IE-script.js 文件并抛出错误，指出 ie 未定义。 - Mike
1
@Mike - 请看答案结尾处：“更新2013年：IE10+不再支持条件注释。” - T.J. Crowder
@T.J.Crowder，我也错过了IE10+的更新，请考虑将更新放在您的答案顶部。 - 8ctopus
3

首先，需要注意的是：这并不是一个好的实践。如果可能的话，你应该努力以一种与浏览器无关的方式设计你的网站，这样它就可以在所有浏览器中一致地工作，而不需要为特定浏览器的问题维护各种技巧和hack。

但如果你真的想这么做，最简单的方法是只在IE浏览器下包含一个文件：

<!--[if lt IE 7]>
<script type="text/javascript" src="global.js"></script>
<![endif]-->

（仅在浏览器为IE6或更低版本时包括文件。）

然而，如果你真的想反过来做，这里有一些选择：

  1. 使用服务器端浏览器嗅探在页面绘制之前处理浏览器。也就是说，使用服务器端语言（Java、PHP等）来确定浏览器是什么（通常通过用户代理字符串），然后有条件地包含JS文件。（例如，您可以使用PHP的get_browser函数。）
  2. 使用客户端浏览器嗅探如果浏览器不是IE，则调用另一个JS文件。您可以使用JavaScript本身来确定浏览器，如果浏览器不是IE，则将另一个JS文件插入到页面中。（例如，您可以使用jQuery的browser函数。）
  3. T.J.的答案也提供了使用IE的条件注释的方法。
3

您可以使用IE条件注释。

如果您想在除IE之外的浏览器中显示某些内容，但在IE中不显示，并且仍然能够验证，则可以使用以下代码：

<!--[if !IE]>-->
  <script src="..."></script>
<!--<![endif]-->
3

除了条件注释之外，还有一个不太为人知的IE功能叫做条件编译。可以参考http://msdn.microsoft.com/en-us/library/7kx09ct1%28VS.80%29.aspx

以下示例来自于它们的文档：

/*@cc_on @*/
/*@if (@_jscript_version >= 5)
document.write("JScript Version 5.0 or better.<BR>");
@else @*/
document.write("You need a more recent script engine.<BR>");
/*@end @*/
1
1
你也可以使用IE的条件注释，在非IE浏览器中插入某些内容。是的，真的。 - T.J. Crowder
1

是的，IE的条件脚本就是你的答案：

<!--[if lt IE 7 ]>
  <script src="/js/my_ie_script.js"></script>
<![endif]-->
这将会做与 OP 所要求的准相反的事情。 - T.J. Crowder
真的，你说得对。我怎么错过了原帖中的“不”字呢？现在已经很晚了！ - mkoistinen
0

怎么样把它转过来呢？如果这是可能的话，您可以使用IE的条件注释：http://www.quirksmode.org/css/condcom.html

否则，您可以嗅探用户代理，但这被认为是“不良实践”。

您不必反转它，IE的条件注释可用于针对非IE浏览器进行定位（是的，真的）。 - T.J. Crowder
0

以下是一个在2022年可用的解决方案。

<html>
<head>
<script>

// Test if running in Internet Explorer or not
function isIE () {
    var myNav = navigator.userAgent.toLowerCase();
    return (myNav.indexOf('msie') != -1 || myNav.indexOf('trident') != -1) ? true : false;
}

if (isIE()) {
    var script = document.createElement('script');
    script.src = "https://unpkg.com/core-js-bundle@3.6.5/minified.js";
    document.head.appendChild(script);
}

</script>
</head>
<body>
</body>
</html>
1
用户代理嗅探众所周知是不可靠的，仅此而已。它很容易被欺骗等（请注意，欺骗者会得到他们应得的惩罚。 :-) ） - T.J. Crowder
1
@T.J.Crowder 感谢您更新您的解决方案，非常出色。 - 8ctopus
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接