如何使以AB-开头的单词可点击?

Question

这里有一些基本的HTML：

<p>Here is a reference: AB-AAA111</p>
<p>Here is a reference: AB-BBB222</p>
<p>Here is a reference: AB-CCC333, AB-DDD444</p>
<p>Here is a reference: AB-EEE555</p>

如您所见，每个段落都包含一个以 AB- 开头的引用

最终目标：在Geasemonkey中使用JS/jQuery，使每个AB-引用可点击。例如：

<p>Here is a reference: <a href="localhost/AAA111"> AB-AAA111 </a> </p>

我知道如何使用正则表达式来挑选以 AB-/AB-\w+/gi 开头的单词，并且我知道如何分配变量并替换字符串的特定部分。

我无法弄清楚的是在这种情况下如何将它们缝合在一起？

Answer 1

如果你真的想通过一个简单的正则表达式来做到这一点，你可以使用这个：

document.body.innerHTML = document.body.innerHTML
.replace(/bAB-(w+)/g, '<a href="http://localhost/$1">$&</a>');

但是，请注意，仅替换 HTML 文档中的字符串始终是一个非常糟糕的主意。想象一下，例如，可能会有一些类名，例如<div class="AB-123" id="abc">.这种方法会破坏整个网站。请勿在您自己无法控制的网站上使用它。

而是尝试仅分析文本节点。document为您提供了在特定节点上工作evaluate方法。您也可以搜索所有文本节点，例如：

let nodes = document.evaluate('//text()[contains(.,"AB-")]', document,
null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null);

这将为您提供一个可以通过nodes.iterateNext()迭代的节点列表。缺点是解析像AB-<b>123</b>这样的超文本变得非常困难。

Answer 2

你真的不需要使用正则表达式

inputs = document.getElementsByTagName('p');
for(var i = 0; i < inputs.length; i++) {
var p = inputs[i].innerHTML.substring(21);
if(p.startsWith("AB")) {
inputs[i].innerHTML = "<a href='*'>" + p;
inputs[i].innerHTML += "</a>";
}
}

只需修剪不包含 AB... 序列的字符串开头部分。之后你需要做的就是检查开头是否以 AB 开头，并修改这些元素的 innerHTML。

如果您想为该部分使用正则表达式，请使用类似以下内容

var re = new RegExp("^AB");
var match = re.test("AB");

查看它是否以该序列开头。

我敢肯定，可能有一个更详细的解决方案来向这些项目添加标签，但这很简单而且有效。

希望这有帮助，干杯