js-使用replace方法替換html元素

Question

我有個問題。 我今天早上有工作，但我不知道該怎么做。 我在這里的工作（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方法使此字符串成為HTMLelement？

Answer 1

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

Answer 2

將值.html()回時，請使用.html()而不是.text()這樣它就不會對其進行編碼，如下所示：

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

你可以在這里看到一個演示

另外，如果您要對許多元素執行以下操作，則可以將方法傳遞給.html() ：

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

請注意，這也使用.html()作為源，但對示例代碼沒有影響。

你可以在這里看到一個演示