javascript - 如何在 JQuery 中使用替换语句但排除一个类？

Question

我有一个搜索引擎。当您转到下一页时，搜索栏中的关键字会在页面上突出显示。但是，有一个我不想突出显示的特定链接。荧光笔弄乱了链接网址，所以我得到一个链接，如:<a href='page.php?url=ha<mark>ppy</mark>'</a> ha<mark>ppy</mark></a>

这是我正在使用的代码:

function term(word) {
    var src_str = $("#page").html();
var term = word;
term = term.replace(/(\s+)/,"(<[^>]+>)*$1(<[^>]+>)*");
var pattern = new RegExp("("+term+")", "gi");

src_str = src_str.replace(pattern, "<mark>$1</mark>");
src_str = src_str.replace(/(<mark>[^<>]*)((<[^>]+>)+)([^<>]*<\/mark>)/,"$1</mark>$2<mark>$4");

$("#page").html(src_str);
}

我希望代码具有相同的替换功能，但不替换 .topic_link

编辑

问题不仅仅在于 .topic_link 。该代码会影响页面的所有html。因此，如果我搜索“div”，所有外部 HTML 代码都会受到影响。有没有办法只影响文档的文本而不影响 HTML？

Answer 1

看来你必须遍历 child 并检查他们的 node types 。 由于每个 child 都可以有其他 child ，因此必须应用递归:

function changeText(word,element) {   
  $.each(element.contents(),function(){
    if(this.nodeType == 1)
      changeText(word,$(this));
    else if(this.nodeType == 3)
    {
      $(this).replaceWith(term(word,$(this).text()));
    }
  });

}

function term(word,src_str) {

  var term = word;
  term = term.replace(/(\s+)/,"(<[^>]+>)*$1(<[^>]+>)*");
  var pattern = new RegExp("("+term+")", "gi");

  src_str = src_str.replace(pattern, "<mark>$1</mark>");
  src_str = src_str.replace(/(<mark>[^<>]*)((<[^>]+>)+)([^<>]*<\/mark>)/,"$1</mark>$2<mark>$4");

  return src_str;
}

现在调用:

changeText("YourWord",$("#page"));

这已经在少量 od 数据上进行了测试，所以我不知道它是否足够高效。