Question

热门使用document.querySelectorAll获取多个选择器值？

我需要在选择器中获取URL。

<div class".myClass"><a href="link1.html"></a>
<div class".myClass"><a href="link2.html"></a>
<div class".myClass"><a href="link3.html"></a>

我正在尝试使用以下内容，但它无效：

var x = document.querySelectorAll(".myClass");

for(var i = 0; i < x.length; i++) {
    console.log (x[i].childNodes[1].href);
}

Answer 1

为Html中的元素分配类或任何属性的语法是：

<div class="myClass">

您不需要.为某个元素指定一个类名，但是如果像上面那样进行访问则需要它。

Answer 2

您的HTML中存在一些问题：

该课程应更改为：<div class".myClass">至<div class="myClass">
您忘了用<div>

</div>

如果您使用document.querySelectorAll()，则可以使用forEach()来迭代所有元素。

var x = document.querySelectorAll(".myClass");
x.forEach(function(element, index){
    console.log(index + ': -> ' + element.children[0].href);
});

<div class="myClass"><a href="link1.html"></a></div>
<div class="myClass"><a href="link2.html"></a></div>
<div class="myClass"><a href="link3.html"></a></div>

如果您不想使用forEach（）（您仍然需要更改第1点和第2点），代码将如下所示：

var x = document.querySelectorAll(".myClass");

for(var i=0; i < x.length; i++){
    console.log(i + ': -> ' + x[i].children[0].href);
}

<div class="myClass"><a href="link1.html"></a></div>
<div class="myClass"><a href="link2.html"></a></div>
<div class="myClass"><a href="link3.html"></a></div>

将字符串追加到网址：

var x = document.querySelectorAll(".myClass");

for(var i=0; i < x.length; i++){
    x[i].children[0].href = x[i].children[0].href + '&item1=yes';
    console.log(i + ': -> ' + x[i].children[0].href);
}

<div class="myClass"><a href="link1.html"></a></div>
<div class="myClass"><a href="link2.html"></a></div>
<div class="myClass"><a href="link3.html"></a></div>

Answer 3

使用class =＆＃34; someClass＆＃34;语法（class="myClass"）。
childNodes索引从0开始。使用x[i].childNodes[0].href
div元素没有相应的结束标记。

带有document.querySelectorAll的多个选择器

3 个答案: