可能的Chrome 45错误:removeChild方法导致父元素中的其他节点消失

时间:2015-10-12 13:34:45

标签: javascript html google-chrome

我遇到了Chrome版本45的问题。

问题: 当我尝试使用JavaScript删除最后一个子div时,Chrome引擎会隐藏父div中的所有其他标记(span和b标记将被隐藏):

<div class='parentDiv' id='pdiv'>
    Some text <span style='color:red;'>BBBBBBBBBBBBBBBBBBBBBBB</span> more example text more example <b style="color:green;">more</b> example text more example more example text more example more example text more example more example text example text example text example text example text example text example text example text example text example text
    <div id='secondChild' style='color:blue;'>
        This div should be removed.
    </div>
</div>
<span class='Execute' onclick="removChild()"><b>Click me</b></span>
<script type='text/javascript'>
    var removChild = function() {
        document.getElementById('pdiv').removeChild(document.getElementById('secondChild'))
    }
</script>

看起来只有当前的Chrome版本(45)受到影响。 Beta和dev频道不受影响。为了测试,我使用了干净的Chrome版本(没有扩展名)。此外,我在Chromium问题报告列表中找不到此问题。

注意:只有当父div内容超过250个字符时才会发生这样的傻瓜。

问题:我的html结构有问题还是Chrome问题?

Fiddle demo

实施例
Example link 1: content of parent div - 448 symbols
Example link 2: content of parent div - 197 symbols

1 个答案:

答案 0 :(得分:0)

我的chrome版本是46.0.2490.71,您的代码对我来说很好。这对我来说看起来像一个铬虫。您可以使用lastElementChild删除secondChild,但它必须是您要删除的parentDiv中的最后一个子项。

你可以用这个替换你的脚本:

var removChild = function() {
    var lastChild = document.getElementById('pdiv');
    lastChild.removeChild(lastChild.lastElementChild);
}

以下是测试您的Chrome版本代码的链接:http://mashpoe.comeze.com/test.html