javascript - 如果我动态更改 html 内容，如何保持 CSS 样式？

Question

我动态更改 HTML 内容。但是当我更改内容时，所有 CSS 样式都被删除了。如何在动态更改内容时保持 CSS 样式？

<div id="sample">
    <a href="#" onClick="call()">Change it </a>
    <p id="para"> I am paragraph </p>
</div>

p {
    background-color: yellow;
}

function call(){    
    $("#para").replaceWith('oops css gone');
} 

这是 jsFiddle:http://jsfiddle.net/rajagopalx/6sbvtpp6/

Answer 1

问题是因为您将整个 p 元素替换为文本节点。相反，只需使用 text() 方法更改初始 p 元素的文本:

function call(){    
    $("#para").text('oops css gone');
}  

Updated fiddle