Javascript 用定位标记替换DOM文本

我正在搜索html正文，但标记显示为纯文本。如何更正此错误，以使锚用名称替换John，并通过链接显示可单击的锚。可以用javascript解决搜索词的替换问题吗？这是不正确的

我正在执行搜索和替换：

htmlreplace(/(John)/gi,"<a href=\"index.html\">$1</a>");

function htmlreplace(a, b, element) {
  if (!element) element = document.body;
  var nodes = element.childNodes;
  for (var n = 0; n < nodes.length; n++) {
    if (nodes[n].nodeType == Node.TEXT_NODE) {
      var r = new RegExp(a, 'gi');
      nodes[n].textContent = nodes[n].textContent.replace(r, b);
    } else {
      htmlreplace(a, b, nodes[n]);
    }
  }
}

htmlreplace（/（John）/gi，”）；
函数htmlreplace（a、b、元素）{
如果（！element）element=document.body；
var节点=element.childNodes；
对于（var n=0；n

这与您的要求非常接近。需要一些重构，但希望这是一个好的开始

htmlreplace( /(John)/gi, "index.html" );

function htmlreplace( regex, link, element ) {
  if ( !element ) { element = document.body; }
  let nodes = element.childNodes;
  nodes.forEach((node)=>{
    if (node.nodeType == Node.TEXT_NODE) {
      let nodeTextContent = node.textContent;
      let match = regex.exec( nodeTextContent );  
      if ( match && node.parentNode.tagName !== "SCRIPT" ){
        let parentNode = node.parentNode;
        let parentHTML = parentNode.innerHTML;
        let a = document.createElement('a');
        a.href = link;
        a.textContent = match[1];
        console.log( 
          match[1],
          parentNode.tagName,
          parentNode.innerHTML,

        );
        parentNode.insertBefore( a, node );
        parentNode.removeChild( node );
        // let addedLink = nodeTextContent.replace( regex, `<a href="${link}">${match[1]}</a>` );
        parentNode.innerHTML = parentHTML.replace( regex, `<a href="${link}">${match[1]}</a>` );
        // parentNode.innerHTML = addedLink;
        // parentNode.innerHTML = nodeTextContent.replace(regex,"") + parentNode.innerHTML;
       }
    } else {
      htmlreplace( regex, link, node );
    }

  })

}

htmlreplace（/（John）/gi，“index.html”）；
函数htmlreplace（正则表达式、链接、元素）{
如果（！element）{element=document.body；}
让节点=element.childNodes；
nodes.forEach（（node）=>{
if（node.nodeType==node.TEXT\u节点）{
让nodeTextContent=node.textContent；
让match=regex.exec（nodeTextContent）；
if（匹配&node.parentNode.tagName！=“脚本”）{
让parentNode=node.parentNode；
让parentHTML=parentNode.innerHTML；
设a=document.createElement（'a'）；
a、 href=链接；
a、 text内容=匹配[1]；
控制台日志（
匹配[1]，
parentNode.tagName，
parentNode.innerHTML，
);
parentNode.insertBefore（a，节点）；
parentNode.removeChild（节点）；
//让addedLink=nodeTextContent.replace（regex，``）；
parentNode.innerHTML=parentHTML.replace（regex，``）；
//parentNode.innerHTML=addedLink；
//parentNode.innerHTML=nodeTextContent.replace（regex，“”）+parentNode.innerHTML；
}
}否则{
htmlreplace（正则表达式、链接、节点）；
}
})
}

这是一个密码笔：

[更新]更新代码以通过以下测试：

你好
约翰

你好，约翰
你好，约翰


约翰你好


约翰你好，约翰

我修改了原始javascript的源代码。它起作用了。我很庆幸它已经解决了

htmlreplace( /(John)/gi, "<a href=\"index.php?name=$1\">$1</a>");

function htmlreplace( regex, link, element ) {
  if ( !element ) { element = document.body; }
  let nodes = element.childNodes;
  nodes.forEach((node)=>{
    if (node.nodeType == Node.TEXT_NODE) {
      let nodeTextContent = node.textContent;
      let match = regex.exec( nodeTextContent );  
      if ( match && node.parentNode.tagName !== "SCRIPT" ){
        let parentNode = node.parentNode;
        parentNode.removeChild( node );
        parentNode.innerHTML = nodeTextContent.replace(regex, link) + parentNode.innerHTML;
       }
    } else {
      htmlreplace( regex, link, node );
    }

  })

}

htmlreplace（/（John）/gi，”）；
函数htmlreplace（正则表达式、链接、元素）{
如果（！element）{element=document.body；}
让节点=element.childNodes；
nodes.forEach（（node）=>{
if（node.nodeType==node.TEXT\u节点）{
让nodeTextContent=node.textContent；
让match=regex.exec（nodeTextContent）；
if（匹配&node.parentNode.tagName！=“脚本”）{
让parentNode=node.parentNode；
parentNode.removeChild（节点）；
parentNode.innerHTML=nodeTextContent.replace（regex，link）+parentNode.innerHTML；
}
}否则{
htmlreplace（正则表达式、链接、节点）；
}
})
}

不要使用文本内容，使用innerHTML是否也可以粘贴HTML代码？@KostasX-为什么？@Programnik-文本节点没有innerHTML:pin如果是这种情况，则需要将文本节点替换为元素节点。只需使用jquery即可。只有当文本节点内容与匹配的单词完全匹配时，您的答案才能正常工作-该文本节点中的任何其他内容都将被删除，这就是我要求测试一些示例标记的原因。：）示例标记没有帮助。。。由于regexp标志是

/gi

，OP显然希望这个词可能存在不止一次：pIt帮助，当我不必编写示例标记来测试自己的代码时。只是想在这里寻求一些帮助，以便尽快完成工作@好极了，还是错了。。。请尝试

John hi

或

John hi John

这样做的一个错误是，如果您有类似于

hello John的内容，我的名字是John

，

hello John

将最终成为

JohnHello

，其中John是一个链接