Javascript 向标记内的文本添加标记_Javascript_Html_Greasemonkey

Javascript 向标记内的文本添加标记

javascript html

Javascript 向标记内的文本添加标记,javascript,html,greasemonkey,Javascript,Html,Greasemonkey,我有以下由第三方自动生成的html文档： <body> <pre> <b>Field1</b> something <b>Field2</b> something else ... </pre> </body> Field1什么的 Field2还有别的吗 ... 我希望最终突出显示在某些情况下以粗体显示的文本之后的文本，因此我选择使用greasemonkey。由于该文本没有与之关联的任何id

我有以下由第三方自动生成的html文档：

<body>
<pre>
<b>Field1</b> something 
<b>Field2</b> something else
...
</pre>
</body>


Field1什么的
Field2还有别的吗
...

我希望最终突出显示在某些情况下以粗体显示的文本之后的文本，因此我选择使用greasemonkey。由于该文本没有与之关联的任何id，我正在考虑重新创建该页面，并且在

和

之间，我将用一个标记标记将所有文本包围起来，标记id是前面字段的文本，如下所示：


Field1什么的
Field2还有别的吗
...

有没有一种不需要重新创建页面就可以实现的简单方法？e、 g在每个标记后插入元素？

如果在该特定页面上没有任何其他粗体元素，并且假设您使用的是文本编辑器，则可以执行“替换”（升华文本中的Ctrl+h和VS）执行搜索，在替换部分放回结束标记并添加附加编辑“使用纯JS，您可以选择所有

节点，在其上循环，并在每次迭代中，将同级文本节点替换为新的

mark

节点

检查下面的工作示例：

document.querySelectorAll（'b'）.forEach（b=>{
设textNode=b.nextSibling；
让newNode=document.createElement（'mark'）；
newNode.id=b.innerText；
newNode.innerHTML=textNode.textContent；
textNode.replaceWith（newNode）；
})


Field1什么的
Field2还有别的吗

我认为重新创建页面是最好的选择。使用其他东西总是一场赌博，因为它永远不会完全符合你的愿望。它需要单独下载页面并不断应用。我希望它在浏览器上打开页面时立即显示。

<body>
<pre>
<b>Field1</b> <mark id=Field1>something </mark>
<b>Field2</b> <mark id=Field2>something else </mark>
...
</pre>
</body>