Question

我正在尝试使用Javascript访问没有ID且具有共享类名的元素。我该如何成功做到这一点？

我尝试使用document.getElementsbyClassName属性，但是由于类名由其他元素共享，因此无法正常工作。

   <a class="sharedClass anotherClass" href="www.mybooks.com" data-m="{"CN":"uniquename"}"> Proceed </a>

我希望能够单击以上代码中的Proceed元素。请注意，uniquename对于该元素是唯一的。我想我们可以在这里以某种方式使用它，但不确定。

Answer 1

正如@Buffalo在他的评论中提到的那样，您可以获取共享类名的所有元素的列表，并遍历结果集并检查data-m属性，直到找到所需的元素为止：

var elements = document.getElementsByClassName("sharedClass");
var myElement;
for (var i = 0; i < elements.length; i++) {
  if (elements[i].getAttribute("data-m") == '{"CN":"uniquename"}') {
    myElement = elements[i];
  }
}

console.log(myElement);

<a class="sharedClass anotherClass" href="www.mybooks.com" data-m='{"CN":"uniquename"}'> Proceed </a>
<a class="sharedClass anotherClass" href="www.mybooks.com" data-m='{"CN":"uniquename2"}'> Proceed </a>

使用querySelector代替也可以使您更简洁：

var myElement = document.querySelector("[data-m='{\"CN\":\"uniquename\"}");
console.log(myElement);

<a class="sharedClass anotherClass" href="www.mybooks.com" data-m='{"CN":"uniquename"}'> Proceed </a>
<a class="sharedClass anotherClass" href="www.mybooks.com" data-m='{"CN":"uniquename2"}'> Proceed </a>

如何使用不带ID的Javascript访问元素？

1 个答案: