javascript IE 的 querySelectorAll 替代方案
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18404362/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
querySelectorAll alternative for IE
提问by Joao Victor
I'm running some javascript which uses this:
我正在运行一些使用它的javascript:
controls = document.querySelectorAll("input,textarea,button");
It should work on IE 9 (which is the version that the developers and the client use). But in our project we use some really old web components that only work properly on compatibility mode. And querySelectorAll only works on standards mode from what i found after some research.
它应该适用于 IE 9(这是开发人员和客户使用的版本)。但是在我们的项目中,我们使用了一些非常旧的 Web 组件,它们只能在兼容模式下正常工作。并且 querySelectorAll 仅适用于我经过一些研究后发现的标准模式。
Is there any alternative?
有什么替代方法吗?
EDIT: it works fine on Chrome and FF
编辑:它在 Chrome 和 FF 上运行良好
回答by Spudley
querySelectorAllworks fine in IE9. It even works in IE8.
querySelectorAll在 IE9 中工作正常。它甚至适用于 IE8。
But it sounds like your problem is getting it to work specifically in quirks mode or compatibility mode.
但听起来您的问题是让它在怪癖模式或兼容模式下专门工作。
If that's the problem then... well, the problem is the mode, not the feature. You need to get the site into standards mode, and then querySelectorAllwill work.
如果那是问题,那么……好吧,问题是模式,而不是功能。您需要使站点进入标准模式,然后querySelectorAll才能工作。
The whole point of compatiblity mode is to make the browser emulate an older version of IE. The main way it does this is by disabling all the features that have been added since that version.
兼容模式的全部意义在于让浏览器模拟旧版本的 IE。它执行此操作的主要方法是禁用自该版本以来添加的所有功能。
So basically what you're saying is "I've switched off half the features in my browser, how can I get one of those features working again?"
所以基本上你说的是“我已经关闭了浏览器中的一半功能,我怎样才能让其中一个功能再次运行?”
And the obvious answer is: switch the features back on again.
显而易见的答案是:再次打开这些功能。
The way to do that is to make sure the browser is in standards mode.
这样做的方法是确保浏览器处于标准模式。
You need to do two things:
你需要做两件事:
Make sure you have a valid doctype, so you can avoid Quirks mode. If you don't have one, add
<!DOCTYPE html>to the very top of your code (above the<html>tag).Add the IE standards mode meta tag somewhere in your
<head>element:<meta http-equiv="X-UA-Compatible" content="IE=Edge" />This will force IE to use the best mode it has available -- so IE9 will be in IE9 standards mode, etc.
确保你有一个有效的文档类型,这样你就可以避免 Quirks 模式。如果您没有,请添加
<!DOCTYPE html>到代码的最顶部(<html>标签上方)。在
<head>元素中的某处添加 IE 标准模式元标记:<meta http-equiv="X-UA-Compatible" content="IE=Edge" />这将强制 IE 使用它可用的最佳模式——因此 IE9 将处于 IE9 标准模式等。
You should make sure both of the above are in all pages in your site.
您应该确保以上两项都在您网站的所有页面中。
[EDIT]
You mention that you're relying on an old component that only works in compatiblity mode.
[编辑]
你提到你依赖一个只能在兼容模式下工作的旧组件。
The basic answer is that you're not going to be able to use querySelectorAllin the same site where you're stuck with compatibility mode. And there's a lot of other modern browser features you'll be missing out on too.
基本答案是,您将无法querySelectorAll在陷入兼容模式的同一站点中使用。还有许多其他现代浏览器功能您也会错过。
If possible, you should try to upgrade that component, or fix it to work in modern standards mode.
如果可能,您应该尝试升级该组件,或修复它以在现代标准模式下工作。
If you reallycan't get out of compatibility mode, then you are pretty much stuck.
如果您真的无法退出兼容模式,那么您就陷入了困境。
Your only real option in this case is to switch to using a library like jQuery that has its own selector engine built in.
在这种情况下,您唯一真正的选择是切换到使用像 jQuery 这样的库,它内置了自己的选择器引擎。
If you've already written your site without using jQuery, then it's a pretty ugly thought to have to rewrite everything to use it, but that's probably the only option you have.
如果您已经在不使用 jQuery 的情况下编写了您的网站,那么必须重写所有内容才能使用它是一个非常丑陋的想法,但这可能是您唯一的选择。
回答by Joao Victor
Well, after some search, i ended up using this:
好吧,经过一番搜索,我最终使用了这个:
if( navigator.userAgent.indexOf("MSIE") != -1 ) {
controls = document.getElementsByTagName('input');
}else{
controls = document.querySelectorAll("input,textarea,button");
}
It works. I'll do some more testing hoping that it will work xD.
有用。我会做更多的测试,希望它会起作用 xD。

