javascript - 原生js删除父元素下面的子元素怎么写-PHP中文网问答

javascript - 原生js删除父元素下面的子元素怎么写

高洛峰 2017-04-11 11:24:33

[JavaScript讨论组]

494

高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。网络人气名人讲师，...

全部回复(4)

大家讲道理2017-04-11 11:26:33 4楼

<p class="parent">
    <li class="good">乖小孩</li>
    <li class="bad">壞小孩</li>
    <li class="good">乖小孩</li>
</p>


var parent = document.querySelector('.parent')
parent.removeChild(parent.querySelector('.bad')) // 只刪除壞小孩 .bad

赞 +0

添加回复

PHP中文网2017-04-11 11:26:33 3楼

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
<input type="button" id="btn" value="删除">
<p id="list">
   <p id="item">1111</p>
</p>
<script>
    function $(id) {
        return document.getElementById(id);
    }

    $('btn').onclick = function() {
        if($('list').children[0]) {
            $('list').removeChild($('item'));
        }
    }
</script>
</body>
</html>

是你这么写的啊

赞 +0

添加回复

阿神2017-04-11 11:26:33 2楼

<body>
        <p class="parent">
            <li class="good">笨小孩</li>
            <li class="bad">壞小孩</li>
            <li class="good">乖小孩</li>
        </p>
        <button onclick="removeC()">delete</button>
        <script>
        var lis = document.getElementsByTagName('li');
        function removeC() {
            lis[0].parentNode.removeChild(lis[0]);
        }
        </script>
    </body>

赞 +0

添加回复

怪我咯2017-04-11 11:26:33 1楼

<body>
    <p class="parent">
        <li class="good">乖小孩</li>
        <li class="bad">壞小孩</li>
        <li class="good">乖小孩</li> 
        <li class="good">乖小孩</li>
    </p>
</body>
<script>
    var parent = document.querySelector('.parent');
    var sp = parent.getElementsByTagName('li');
    for(var i=0;i<sp.length;i++){
        parent.removeChild(parent.querySelector('.bad'));
    }
    /*加个for循环可以随着你的li 的添加，也可以全部删除'坏小孩';*/
</script>

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>