JS Regex:只选择带有attr的链接(a)

Question

我必须选择具有特定数据的链接标签(a)。现在我是这样做的：/<a.*?data-extra-url=".*?<\/a>/g。但是..。由于某些原因，当输入字符串没有任何br ->行时，它会导致一个完全错误的选择，例如：

<div> <br> <a data-some-id="3-6-9;id-1-2-3" data-more-id="1-3-5" data-extra-url="https://somehost.api/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" href="https://somehost.api/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" class="some-class">someDuplicateHere1</a></div> wysiwyg<br> <div><a class="popup-wrap-id-1-2-3" href="https://somehost.api/app/id-1-2-3?someparam=sub-id-1-2-3;sub-sub-id-1-2-3">firstImage</a></div> <br> <div>somecontent</div> <div> <span> <div><a data-some-id="456;789" href="https://somehost.api/app/id-4-5-6?someparam=sub-id-4-5-6;sub-sub-1-2-3">second</a></div> <br> </span> also some more content </div> <div> <span> <div><a data-some-id="3-6-9;id-1-2-3" data-more-id="1-3-5" data-extra-url="https://somehost.api/app/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" href="https://somehost.api/app/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" class="some-class">someDuplicateHere</a></div> rtf<br> </span> <br> </div> </div>

还有一个活生生的例子：https://regex101.com/r/JkI3Fu/1

由于某些原因，在我的选择中有所有的链接，我做错了什么？

因此，我想得到：

array = ['<a data-some-id="3-6-9;id-1-2-3" data-more-id="1-3-5" data-extra-url="https://somehost.api/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" href="https://somehost.api/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" class="some-class">someDuplicateHere1</a>', '<a data-some-id="3-6-9;id-1-2-3" data-more-id="1-3-5" data-extra-url="https://somehost.api/app/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" href="https://somehost.api/app/sub-id-1-2-3?someparam=3-6-9;id-1-2-3" class="some-class">someDuplicateHere</a>']
like here: https://regex101.com/r/NiFFXd/1

Answer 1

重要的是，你的裁判看什么，你不想在你的比赛。像这样使用^

<a[^>]*data-extra-url="[^>]*>[^>]*.

它应该能解决你的问题

Answer 2

您可以使用

document.querySelectorAll('a[data-extra-url]');

[attribute]选择器用于选择具有指定属性的元素。 来自CSS属性选择器