js - 使用replace方法替换html元素答案

【问题标题】：js - using replace method to replace html elementjs - 使用replace方法替换html元素
【发布时间】：2011-02-19 08:41:24
【问题描述】：

我有一个问题。我今天早上有工作，但我不知道该怎么做。我在这里的工作（html）：

<div class="demo">
    <p>this is demo text</p>
</div>

这是我的 JS：

var tempdata = $(".demo").text();
var replacedata = tempdata.replace("text","<span>1234</span>");

看起来一切正常。但结果是：this is demo <span>1234</span>。这不是我想要的结果。如何使用replace方法使这个字符串变成HTML元素？

【问题讨论】：

标签： javascript html methods replace

【解决方案1】：

在将值分配回去时，使用.html() 而不是.text()，这样它就不会对其进行编码，如下所示：

var tempdata = $(".demo").text();
var replacedata = tempdata.replace("text","<span>1234</span>");
$(".demo").html(replacedata);

You can see a demo here

此外，如果您对许多元素执行此操作，您可以将方法传递给.html()，如下所示：

$(".demo").html(function(i, h) {
    return h.replace("text","<span>1234</span>");
});

请注意，这也使用.html() 作为源，但对示例代码没有影响。

You can see a demo of that here

【讨论】：

嗨尼克！ html(function(i, h) - “i”代表什么？
@ming - 它有2个参数，第一个是索引，第二个是当前.html()值:)
我明白了！我试过：$("textarea").html(function(i,h){console.log(h)})。我看到它遍历所有元素，允许我为它申请功能。非常感谢帮助我理解这一点。我可以将这种技术用于所有功能吗？
@ming - 从 jQuery 1.4+ 开始，是的，大多数函数将接受这样的函数。

【解决方案2】：

document.getElementById('demo').firstElementChild.innerHTML =
  document.getElementById('demo').firstElementChild.innerHTML.replace(/text/, "<span>1234</span>");

【讨论】：