通过代码编辑器选中data-view属性为2的li节点,获取其父节点,再获取class属性
时间: 2024-09-06 09:02:29 浏览: 36
在JavaScript中,你可以使用`querySelectorAll`配合循环来完成这个操作。假设HTML结构中有这样的列表项:
```html
<ul>
<li data-view="1">Item 1</li>
<li data-view="2">Item 2</li>
<li data-view="3">Item 3</li>
</ul>
```
你可以通过以下代码来实现:
```javascript
// 获取所有data-view属性为2的li元素
const liElements = document.querySelectorAll('li[data-view="2"]');
// 遍历找到的数据视图为2的li元素
for (let i = 0; i < liElements.length; i++) {
const currentLi = liElements[i];
// 获取当前li元素的父节点
const parentElement = currentLi.parentNode;
// 获取并打印父节点的class属性
console.log(`Parent class of li with data-view 2 is: ${parentElement.className}`);
}
```
这段代码会首先查找所有"data-view"属性为"2"的`<li>`元素,然后获取每个元素的父节点,并打印出它们的`class`属性。
阅读全文