我如何使用纯 javascript 搜索 dom 以查找自定义链接属性?

Question

>假设我有一个链接，例如

<a class="like_button" href="#" action_click="LikePost">I Like It</a>

如何通过纯 JavaScript 搜索 dom 以扫描 html 以查找action_click="LikePost"下面的代码对我不起作用

document.getElementsByTagName('action_click')

我觉得可能需要一个正则表达式。

Answer 1

使用document.querySelector

document.querySelector('[action_click="LikePost"]');

如果有多个这样的元素，请使用document.querySelectorAll这将返回一个实时HTMLCollection.

document.querySelectorAll('[action_click="LikePost"]');

Answer 2

你应该像这样使用querySelector()：

console.log(document.querySelector('[action_click="LikePost"]'));

<a class="like_button" href="#" action_click="LikePost">I Like It</a>

Answer 3

如果您只有一个具有该属性的元素，那么querySelector工作。

var elem = document.querySelector('[action_click="LikePost"]');
console.log(elem);

<a class="like_button" href="#" action_click="LikePost">

但是，如果您有多个元素，那么querySelectorAll这就是您需要的：

var elem = document.querySelectorAll('[action_click="LikePost"]');
console.log(elem);

<a class="like_button" href="#" action_click="LikePost">
<a class="like_button" href="#" action_click="LikePost">
<a class="like_button" href="#" action_click="LikePost">