怎么显示出这个效果?怎么达到

 

大体就是这个意思,语法什么的可能写的不规范

<p></p>

<input type=button @click=delp>

<script>

delp(){

document.getElementByTagName('p')

for(var i=0;i<p.length;i++){

child.parentNode.removeChild(child)

}

}

</script>

 

<!DOCTYPE html>
<html>
<body>
    <div>
        <p id="demo1">点击按钮来删除列表中的项目1。</p>
        <p id="demo2">点击按钮来删除列表中的项目2。</p>
        <p id="demo3">点击按钮来删除列表中的项目3。</p>
        <button onclick="myFunction()">试一下</button>
    </div>
    <script>
        function myFunction(){
            var list=document.getElementsByTagName("p");
            list[0].parentNode.removeChild(list[0]);
            if(list[0]){
                myFunction();
            }
        }
    </script>
</body>
</html>

第一步:获取所有p元素

第二步:通过parentNode获取第一个p的父元素,调用removeChild()删除第一个p

第三步:判断文档中是否还有p元素,如还有,则自动再次执行该方法进行删除

这个挺简单的,还告诉你思路了,连用什么属性和知识点都说了