Javascript/jQuery - 需要在页面上查找原始文本，将后面的内容捕获到变量中，并用 HTML 替换原始文本

Question

假设文本 KEYWORDANIMAL:(Cat) 出现在页面上。我想在页面中搜索 KEYWORDANIMAL 的所有实例，然后将实际的动物（在本例中为 Cat）拉到一个变量中，以在另一个脚本中使用，该脚本将拉入相关内容。我还想用一个空的 div 替换 KEYWORDANIMAL:(Cat) 并连接 ID 以供其他脚本作为目标（这个其他脚本本身已经可以正常工作）。

我一直在这里使用来自其他几个线程的信息，但无法将它们全部融合在一起。

-Find text string using jQuery?

-Get text from character and after using jQuery

-How do I use JQuery to replace all occurring of a certain word in a webpage?

这是我目前所拥有的：

<p>Here is an animal: KEYWORDANIMAL(Cat)</p>

var findString = $('p:contains("KEYWORDANIMAL")').html();
var startIDString = findString.indexOf('(') + 1;
var endIDString = findString.indexOf(')');
var animalID = findString.substring(startIDString, endIDString);
var embedString1 = "<div id=\"";
var embedString2 = "\"></div>";
var embedStringFull = embedString1 + "animal" + animalID + embedString2;
alert(embedStringFull);

findString.each(function () {
    var newDIV = $(this).html().replace('KEYWORDANIMAL', embedStringFull);
    $(this).html(newDIV);
});

小提琴形式：http://jsfiddle.net/dC6bj/1/

我找到了部分（虽然可能效率不高），但我显然在替换时遗漏了一些东西。

Answer 1

关于如何替换网页中某个单词的所有出现的第三个问题，请使用 Regex.Replace，如下所示：

var pagecontent = $('body').html();
var newcontent = Regex.Replace(pagecontent , @"[cat]", "dog");
&('body').html(newcontent);

Regex 是这类东西最快的解决方案。 我的代码示例有点简单，它也会替换标签中的出现。 或在一个单词中，例如双体船或。

为了使其更完美，您可以查找 cat 前面有一个空格，然后是一个空格、一个点或一个逗号。为此阅读一些正则表达式教程。 （真的很值得学习，一旦你知道了，你就会用得很多）

祝你好运！

Answer 2

如果您绝对必须使用 JavaScript 执行此操作，您可以使用正则表达式替换函数：

var animal_regex = /KEYWORDANIMAL\((.*?)\)/g;

$('p:contains("KEYWORDANIMAL")').each(function() {
    var $this = $(this);
    var html =  $this.html().replace(animal_regex, function(match, name) {
        return '<div id="animal' + name + '"></div>';
    });

    $this.html(html);
});

演示：http://jsfiddle.net/dnuaL/

如果可能，这应该在服务器端完成。