为什么.text（）。replace（）删除我的html？

Question

FIDDLE UPDATED TO CLASSES

<p id="boohoo"><b id="why did all this disappear">Old Text</b></p>    
<p id="boohoo"><h4 id="why did this not work">Old Text</h4></p>

---

var x = $('#boohoo').text().replace('Old', 'New'); 
function whyNotBold() {
    $('#boohoo').text(x); 
}

为什么<b>和<h4>之间存在差异？当我插入文本时，如何让前<b id="... html不会消失？我认为.text().replace(...只会替换文本而不会影响html，但这似乎不是这里的情况，因为它正在删除它。

Answer 1

你有2个元素具有相同的id，这是错误的。因此，您的替换工作仅限于第一个元素。

第二个是text（）函数剥离标记并仅返回第一个节点的文本内容：Old Text。当您使用text（）func设置文本时，jquery认为您希望您的节点<p id="boohoo">包含文本 ONLY ，并且这样做：

<p id="boohoo">New Text</p>

对于text nodes

，请使用text（）func

修改：

在你的情况下，你可以做你想做的事情：

var x = $('b').text().replace('Old', 'New'); 

function whyNotBold() {
    $('b').text(x); 
    $('h4').text(x); 
}
setTimeout(whyNotBold, 300);

Demo