javascript - 删除元素

时间:2013-06-08 22:23:04

标签: javascript html

我的问题相当基本,但我不明白为什么,在下面的代码中,按钮点击按钮消失,而不是整个div:

<script>
    function remove(id) {
        //get the element node
        element = document.getElementById(id);

        //remove the element from the document
        document.removeChild(element);
    }
</script>

<div id="intro" class="jumbotron">
    <h1>Your Offline Web Dictionary!</h1>
    <p class="lead">

    <div class="controls">
        <input class="span7 " type="text" placeholder=" " name="key">
    </div>
    <div>
        <button class="btn btn-large btn-success" onclick="remove(intro)">
            Dictionary Search
        </button>
    </div>
</div>

JSFiddle

3 个答案:

答案 0 :(得分:4)

问题是button元素有一个remove属性,因此调用而不是remove函数。还有字符串。

<button class="btn btn-large btn-success" onclick="window.remove('intro');console.log(this.remove);">
    Search
</button>

http://jsfiddle.net/HMEVd/76/

答案 1 :(得分:2)

两个问题。首先,intro应该是字符串,而不是标识符,因此请在onclick中使用remove('intro')

其次,document.rwmoveChild不正确。应该在要删除的元素的父级上调用removeChild。通常使用:

element.parentNode.removeChild(element);

答案 2 :(得分:1)

intro应该作为字符串而不是变量发送到函数,即'intro'

此外,您必须重命名您的功能,例如removeById而不是remove。然后它完美地运作。

函数remove实际上做了一些完全不同的事情。 (当您将函数命名为remove时,甚至不会调用它,因为您可以通过向其中添加警报消息来查看它。)

function removeById(id) {
        //get the element node
        element = document.getElementById(id);

        //remove the element from the document
        document.removeChild(element);
}

...
<button class="btn btn-large btn-success" onclick="removeById('intro')">