javascript动态销毁HTML元素

javascript动态销毁HTML元素

转载至：http://hi.baidu.com/marsbook/blog/item/f42771871f646c2dc75cc375.html

2008/12/10 00:33

动态销毁元素
对象.removeNode(true); //删除自己，自杀式
对象.parent.removeChild(child); //父杀子

---作者的文笔浅显易懂，幽默风趣，特此转载。

有些元素不用removeNode方法删除，那么可以用setAttribute('style', 'display:none')的方法来隐藏，或许也能达到目的。

评论

1 楼 njl_041x 2011-09-14  

不错！

在下有个问题想请教，还望指点。

如下代码：

<div id="div111" style ="width:200px; height :200px ; background :red; margin :100px auto auto 100px;" onmouseenter="mouseEnter(this.id);" onmouseleave="mouseLeave(this.id);">
<div id="div222" style ="width:100px; height :100px; background :yellow;" onmouseenter="mouseEnter(this.id);" onmouseleave="mouseLeave(this.id);">
<div id="div333" style =" width:50px; height :50px; background :blue;" onmouseenter="mouseEnter(this.id);" onmouseleave="destroySelf(this);" onclick ="destroySelf(this);">
</div>
</div>
</div>
<p id="log"></p>
<script type ="text/javascript" >
    function mouseEnter(id) {
        $("#log").append(id+"触发了onmouseEnter事件<br/>");
    }
    function mouseLeave(id) {
        $("#log").append(id + "触发了onmouseLeave事件<br/>");
    }
    function destroySelf(obj) {
        $(obj).remove();
    }
</script>

说明：这是嵌套的三层div。div111最外层，div222中间层，div333最内层。

想要的结果是：当鼠标从div333移出（mouseleave）时，销毁（使用$().delete()）自身（div333），但不能触发其父div（div111和div222）的mouseenter事件。

请问如何实现？？？

请发送答案至： [e-mail]

先谢过了。