JS querySelectorAll()方法，查找CSS选择器元素

querySelectorAll()方法

JavaScript中document对象的querySelectorAll()方法可以查找匹配CSS选择器匹配到的所有HTML元素，构成一个元素集合，类型为 [object NodeList]。比如可以通过id、类名、元素名、属性、属性值、组合选择器和伪类选择器等css选择器。

语法

docuement.querySelectorAll( selector )

参数

参数	描述
selector	CSS选择器，JS字符串类型值

返回值

[object NodeList]，元素的集合，可以通过索引的方式访问querySelectorAll()查找到的元素，并对其进行相关的设置，具体可见下方的实例代码。

querySelectorAll()方法实例代码，及在线编辑器

实例将演示通过类、id和属性值的CSS选择器作为参数传递给querySelectorAll()的使用方法：

<p class='q1'>段落类属性为q1</p>
<p id='q2'></p>
<input type='number' max='9'>

<script>
  var p = document.querySelectorAll('p.q1')
  document.querySelectorAll('#q2')[0].innerHTML = '类型为：'+p
  p[0].style.color = 'skyblue';
  var i = document.querySelectorAll("input[max='9']");
  i[0].style.width = '100%';
</script>

hot：热门