在对象中搜索元素

JavaScript- searching element withing an object

本文关键字:元素 搜索 对象      更新时间:2023-09-26

假设我有一个ul,类名为'images',包含各种li对象。我有一个JS变量使用

指向的列表
var list = document.GetElementsByClassName("images")[0]; //single 'images' exist in document

如何搜索var list所指向的列表中的所有li元素?在互联网上搜索得到这个-

var list = document.getElementsByClassName("images")[0];
var list = *!*element.*/!*getElementsByTagName("li"); // getting syntax error at this line

有没有办法做到这一点没有jQuery?

使用querySelectorAll

当访问DOM节点时,您可以使用现在非常常见的querySelectorAll

假设html结构为:

<ul class="images">
  <li>Bob Thorton</li>
  <li>Joe Biden</li>
  <li>Tom <strong>Yorke</strong></li>
</ul>

你的JavaScript将是:

// Query for the item
var items = document.querySelectorAll('.images li strong');
// Do what you need to do
// Note that items is an array so we access the first result [0]
items[0].style.color = '#f00';

注意,querySelectorAll返回一个类似于数组的NodeList。在上面的例子中,我们把列表当作一个数组,只获取第一个DOM元素的颜色为红色。

演示