querySelectorAll alternative for IE

querySelectorAll alternative for IE

本文关键字：IE for alternative querySelectorAll      更新时间：2023-09-26

我正在运行一些使用以下内容的javascript：

controls = document.querySelectorAll("input,textarea,button");

它应该在IE 9上工作（这是开发人员和客户端使用的版本）。但在我们的项目中，我们使用了一些非常旧的web组件，这些组件只能在兼容模式下正常工作。querySelectorAll只在标准模式下工作，这是我经过一些研究后发现的。

还有其他选择吗？

EDIT：它在Chrome和FF 上运行良好

querySelectorAll在IE9中运行良好。它甚至适用于IE8。

但听起来你的问题是让它专门在怪癖模式或兼容性模式下工作。

如果这就是问题所在，那么。。。问题是模式，而不是功能。您需要让站点进入标准模式，然后querySelectorAll才能工作。

兼容模式的全部目的是让浏览器模仿旧版本的IE。它做到这一点的主要方法是禁用自该版本以来添加的所有功能。

所以基本上你说的是"我已经关闭了浏览器中一半的功能，我如何才能让其中一个功能重新工作？"

显而易见的答案是：重新打开这些功能。

这样做的方法是确保浏览器处于标准模式。

你需要做两件事：

  1. 请确保您有一个有效的doctype，这样您就可以避免Quirks模式。如果没有，请将<!DOCTYPE html>添加到代码的最顶部（<html>标记上方）。

  2. 在<head>元素的某个位置添加IE标准模式元标签：

    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

    这将迫使IE使用其可用的最佳模式——因此IE9将处于IE9标准模式，等等。

你应该确保以上两个都在你的网站的所有页面上。

[EDIT]
您提到您所依赖的是一个只能在兼容模式下工作的旧组件。

基本的答案是，在兼容模式下，您将无法在同一个站点中使用querySelectorAll。还有很多其他现代浏览器功能你也会错过。

如果可能，您应该尝试升级该组件，或者将其修复为在现代标准模式下工作。

如果真的无法脱离兼容模式，那么你就陷入了困境。

在这种情况下，您唯一真正的选择是切换到使用像jQuery这样的库，该库内置了自己的选择器引擎

如果你已经在不使用jQuery的情况下编写了你的网站，那么必须重写所有内容才能使用它是一个非常糟糕的想法，但这可能是你唯一的选择。

好吧，经过一番搜索，我最终使用了这个：

if( navigator.userAgent.indexOf("MSIE") != -1 ) {                    
   controls = document.getElementsByTagName('input');
}else{    
   controls = document.querySelectorAll("input,textarea,button");
}

它有效。我会做更多的测试，希望它能在xD上工作。

根据MDN

还有一种与Internet Explorer兼容的使用方式Array.prototype.forEach for迭代：

const list = document.querySelectorAll('input[type=checkbox]');
Array.prototype.forEach.call(list, function (checkbox) {
  checkbox.checked = true;
});

你想这么做吗？

相关文章：