我的页面上有一堆锚标签，有不同的参考URL。如何使用queryselectorAll来选择标签的子集？

Question

我的页面上有一堆锚点标签，并有不同的参考网址，如何使用queryselectorAll选择所有锚点标签？如何使用queryselectorAll来选择除指向页面的锚标签以外的所有锚标签？

例子

<a href='abc.com'....</a>
<a href='xyz.com'.....</a>
<a href='abc.com/ghtcj/jkfhjkf'....</a>

我想选择所有不包含 "href "的子串 "abc.com "的锚标签。

我试过 querySelectorAll(a:not([href*="abc.com"]). 但这对我来说是行不通的。有人能帮助我如何解决这个问题吗？

EDIT:Ok我纠正了我的上述声明。querySelectorAll(a:not([href*="abc.com"]) 是按预期工作。但我想补充这个查询。如果我的锚标签有一个图片元素，如下图所示，当我点击该图片面板时，事件没有得到预期的触发。只有当我点击图片下方时，事件才会被触发。html元素的例子是这样的

<a href='abc.com'...><img src='h../abc.jpg' class = "image-panel"> </a>

谁能帮帮我？

Answer 1

对我来说，似乎很好用。

console.log(document.querySelectorAll('a:not([href*="abc.com"])'))

<a href='abc.com'>....</a>
<a href='xyz.com'>.....</a>
<a href='abc.com/ghtcj/jkfhjkf'>....</a>