Question

我有这一部分。

<section class="note">
    Content-0: SomeContent that needs to be removed. Anything below this stays.
    <br />
    <div class="content1">Content-1: Stays <br /><br /></div>
    <div class="content2"><p>Content-2: Stays</p></div>
</section>

我想要的是页面加载删除Content-0行，只有两个s。所以我加载了这段代码......

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $(function () {
        var content1 = $('section.note div.content1');
        var content2 = $('section.note div.content2');

        $('section.note').html('').append(content1).append(content2);
        alert($('section.note').html());
    });
</script>

但它在IE（所有版本）中表现得很奇怪。在IE 10中，它附加了div但没有内容。在其他IE版本中，它不会删除Content-0并保留所有内容。

它在FireFox中运行良好。

Answer 1

试试这个：

$(function () {
    var content1 = $('section.note div.content1').clone();
    var content2 = $('section.note div.content2').clone();

    $('section.note').html('').append(content1).append(content2);
    alert($('section.note').html());
});

基本上发生了什么，在这里：var content1 = $('section.note div.content1')你指的是实际的DOM元素，然后你首先用$('section.note').html('')删除DOM元素，然后再次追加这些引用，但同时通过将html设置为＆＃39;＆＃39;来消失文本。所以克隆这些div会修复它，因为你不再引用原始的DOM元素了。

Answer 2

似乎IE正在快速清理元素，以至于jquery无法正确移动它们，因为它们已被前面的.html('')调用删除。您可以通过克隆或分离来解决这个问题。

http://jsfiddle.net/DrxFV/2/

var content1 = $('section.note div.content1').detach();
var content2 = $('section.note div.content2').detach();
$('section.note').html('').append(content1).append(content2);

jquery .append在IE中没有按预期工作

2 个答案: