当前位置:网站首页 > 创业 > 正文

JavaScript实现DOM删除节点?JS删除DOM节点示例

0 张子豪 张子豪 2025-10-12 08:45 1

       本经验是介绍JavaScript说话中,利用removeChild() 函数删除节点的详解。

东西/原料

  • 电脑
  • 文本编纂器

JS函数介绍

  1. 1

    removeChild() 函数的介绍如下图:

  2. 2

    removeChild() 函数的语法如下图:

  3. 3

    removeChild() 函数语法参数申明:

函数应用示例

  1. 1

    removeChild() 函数的实现代码:

    //删除函数

    function removeDom(){

       var deldom=document.getElementById('removedom');

       if(deldom.hasChildNodes()){

            deldom.removeChild(deldom.lastChild);

           } 

       }

  2. 2

    实现函数的挪用代码如下:

     <body>

        <h1>删除节点</h1>

        <div id="removedom">

           <p>节点一</p>

           <p>节点二</p>

        </div>

        <form>

           <input type="button" value="删除操作" onclick="removeDom();"/>

    </form>

    </body>

  3. 3

    示例的完整代码:

    <!doctype html>

    <html>

     <head>

      <meta charset="UTF-8">

      <meta name="Generator" content="EditPlus®">

      <title>removeChild方式示例</title>

    <script language="javascript">

    //删除函数

    function removeDom(){

       var deldom=document.getElementById('removedom');

       if(deldom.hasChildNodes()){

            deldom.removeChild(deldom.lastChild);

           } 

       }

    </script>

     </head>

     <body>

        <h1>删除节点</h1>

        <div id="removedom">

           <p>节点一</p>

           <p>节点二</p>

        </div>

        <form>

           <input type="button" value="删除操作" onclick="removeDom();"/>

    </form>

    </body>

    </html>

    示例利用结果:

注重事项

  • 但愿对读者有所帮忙~~~喜好的请给小编点个年夜拇指

来源:百闻(微信/QQ号:9397569),转载请保留出处和链接!


本文链接:https://www.ibaiwen.com/web/239780.html

张子豪

张子豪

TA很懒,啥都没写...

@百闻娱乐 本站部分内容转自互联网,若有侵权等问题请及时与本站联系,我们将在第一时间删除处理。 | 粤ICP备2024343649号 | (地图