PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > Jquery教程 > 正文

    jQuery 入门教程:删除HTML元素

    作者:admin来源:网络浏览:时间:2020-09-30 00:07:50我要评论
    导读:jQuery使用下面两个方法来删除或是清空某个HTML元素。remove() – 删除指定的元素(包括其子元素)empty() – 清空指定元素...
    jQuery使用下面两个方法来删除或是清空某个HTML元素。
     
    remove() – 删除指定的元素(包括其子元素)
    empty() – 清空指定元素的子元素
    例如:
     
     
    [html]  
    <!DOCTYPE html>  
    <html>  
    <head>  
        <meta charset="utf-8">  
        <title>JQuery Demo</title>  
        <script src="scripts/jquery-1.9.1.js"></script>  
        <script>  
            $(document).ready(function () {  
                $("button").click(function () {  
                    $("#div1").remove();  
                });  
            });  
        </script>  
    </head>  
    <body>  
      
        <div id="div1" style="height: 100px; width: 300px;  
            border: 1px solid black; background-color: yellow;">  
            This is some text in the div.  
            <p>This is a paragraph in the div.</p>  
            <p>This is another paragraph in the div.</p>  
      
        </div>  
        <br>  
        <button>Remove div element</button>  
      
    </body>  
    </html>  
     
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>JQuery Demo</title>
        <script src="scripts/jquery-1.9.1.js"></script>
        <script>
            $(document).ready(function () {
                $("button").click(function () {
                    $("#div1").remove();
                });
            });
        </script>
    </head>
    <body>
     
        <div id="div1" style="height: 100px; width: 300px;
            border: 1px solid black; background-color: yellow;">
            This is some text in the div.
            <p>This is a paragraph in the div.</p>
            <p>This is another paragraph in the div.</p>
     
        </div>
        <br>
        <button>Remove div element</button>
     
    </body>
    </html>
     
     
     
    jQuery 入门教程:删除HTML元素
     
    empty() 示例:
     
    [html]  
    <!DOCTYPE html>  
    <html>  
    <head>  
        <meta charset="utf-8">  
        <title>JQuery Demo</title>  
        <script src="scripts/jquery-1.9.1.js"></script>  
        <script>  
            $(document).ready(function () {  
                $("button").click(function () {  
                    $("#div1").empty();  
                });  
            });  
        </script>  
    </head>  
    <body>  
      
        <div id="div1" style="height: 100px; width: 300px;  
            border: 1px solid black; background-color: yellow;">  
            This is some text in the div.  
            <p>This is a paragraph in the div.</p>  
            <p>This is another paragraph in the div.</p>  
      
        </div>  
        <br>  
        <button>Empty the div element</button>  
      
    </body>  
    </html>  
     
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>JQuery Demo</title>
        <script src="scripts/jquery-1.9.1.js"></script>
        <script>
            $(document).ready(function () {
                $("button").click(function () {
                    $("#div1").empty();
                });
            });
        </script>
    </head>
    <body>
     
        <div id="div1" style="height: 100px; width: 300px;
            border: 1px solid black; background-color: yellow;">
            This is some text in the div.
            <p>This is a paragraph in the div.</p>
            <p>This is another paragraph in the div.</p>
     
        </div>
        <br>
        <button>Empty the div element</button>
     
    </body>
    </html>
    jQuery 入门教程:删除HTML元素
    jQuery的remove()方法也支持一个参数,可以用于过滤一些需要删除的HTML元素。这个参数可以为任何有效的jQuery selector.
    比如下面代码只删除class=”italic”的<p>元素:
     
     
    [javascript] 
    $("p").remove(".italic");  
     
    $("p").remove(".italic");
     
    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-47-1419-1.html
    相关热词搜索: jQuery教程