我的 html 包含这个
<div id="container"></div>
当我在 javascript 中执行此操作时
$("#container").append( '<div>' );
$("#container").append( '<p>' );
$("#container").append( 'test content' );
$("#container").append( '</p>' );
$("#container").append( '</div>' );
它在浏览器中生成此内容
<div id="container">
<div></div>
<p></p>
"test content"
<p></p>
</div>
而不是这个
<div id="container">
<div>
<p>
"test content"
</p>
</div>
</div>
为什么 div 和 p 元素的顺序严重失调?显然是 append 了额外的 </div>
和</p>
我的代码未 append 的元素。为什么?
最佳答案
无论是否显式指定结束标记,jQuery 都会创建一个节点,并且 $("#container").append( '<div>' );
和$("#container").append( '<p>' );
您需要做的就是 append 到新元素
$("#container").append( '<div>' );
$("#container div").append( '<p>' );
$("#container p").append( 'test content' );
或者将 html append 到一个语句中。
$("#container").append( '<div><p>test content</p></div>' );
关于jQuery .append() 产生乱序的 html 元素。为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41387738/