querySelectorAll与getElementsBy对比有什么不同

javascript中的querySelectorAll与getElementsBy都可以获取dom元素对象，但是他们又有什么不同点呢？本文将从各方面分析他们的区别，还有没写到的地方请大牛补充

1 W3C 标准

querySelectorAll 属于 W3C 中的 Selectors API 规范。而 getElementsBy 系列则属于 W3C 的 DOM 规范。

2 浏览器兼容

querySelectorAll 已被 IE 8+、FF 35+、Safari 31+、Chrome 和 Opera 10+ 良好支持 。

getElementsBy 系列，以最迟添加到规范中的 getElementsByClassName 为例，IE 9+、FF 3 +、Safari 31+、Chrome 和 Opera 9+ 都已经支持该方法了。

3 接收参数

querySelectorAll 方法接收的参数是一个 CSS 选择符。而 getElementsBy 系列接收的参数只能是单一的className、tagName 和 name。代码如下：

代码如下 复制代码

var c1 = documentquerySelectorAll('b1 c');

var c2 = documentgetElementsByClassName('c');

var c3 = documentgetElementsByClassName('b2')[0]getElementsByClassName('c');

需要注意的是，querySelectorAll 所接收的参数是必须严格符合 CSS 选择符规范的。所以下面这种写法，将会抛出异常。代码如下

功能上大致相同。

querySelectorAll用法：querySelectorAll("class")或者querySelectorAll("#id")类似于jquery的$("")函数。

getElementsByTagName用法：getElementsByTagName("p")，和js的源生getElementById这种类似。

区别：

querySelectorAll浏览器支持： IE 8+、FF 35+、Safari 31+、Chrome 和 Opera 10+

getElementsByTagName浏览器支持：IE 9+、FF 3 +、Safari 31+、Chrome 和 Opera 9+

其他的说了你也看不懂。

HTML5向Web API新引入了documentquerySelector以及documentquerySelectorAll两个方法用来更方便地从DOM选取元素，功能类似于jQuery的选择器。这使得在编写原生JavaScript代码时方便了许多。

用法

两个方法使用差不多的语法，都是接收一个字符串参数，这个参数需要是合法的CSS选择语法。

element = documentquerySelector('selectors');

elementList = documentquerySelectorAll('selectors');

其中参数selectors 可以包含多个CSS选择器，用逗号隔开。

element = documentquerySelector('selector1,selector2,');

elementList = documentquerySelectorAll('selector1,selector2,');

使用这两个方法无法查找带伪类状态的元素，比如querySelector(':hover')不会得到预期结果。

一、网络设置的问题 这种原因比较多出现在需要手动指定IP、网关、DNS服务器联网方式下，及使用代理服务器上网的。仔细检查计算机的网络设置。 二、DNS服务器的问题 当IE无法浏览网页时，可先尝试用IP地址来访问，如果可以访问，那么应该是DNS的

以上就是关于querySelectorAll与getElementsBy对比有什么不同全部的内容，包括:querySelectorAll与getElementsBy对比有什么不同、javascript中querySelectorAll和getElementsByTagName有什么区别、a.querySelectorAll("*,:x")报错是什么意思等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！