在 jQuery 中, 可以利用 remove() 方法或 empty() 方法来删除元素. 下面本篇文章就来给大家介绍一下 remove() 方法和 empty() 方法. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
1, 使用 remove() 方法来删除元素
remove() 方法: 删除被选元素及其所有子元素. 该方法也会移除被选元素的数据和事件.
remove() 方法可接收一个参数, 用于删除接收参数所代表的元素, 其它未接收的参数则过滤不删除. 例:
无参数时:$("#div1").remove();
有参数时:$("div").remove("#content") ;
示例:
- <!DOCTYPE html>
- <HTML>
- <head>
- <meta charset="utf-8">
- <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
- </script>
- <script>
- $(document).ready(function() {
- $("button").click(function() {
- $("p").remove();
- });
- });
- </script>
- </head>
- <body>
- <p>
- 这是一个段落.
- </p>
- <p>
- 这是另一个段落.
- </p>
- <button>
- 移除所有 P 元素
- </button>
- </body>
- </HTML>
效果图:
2, 使用 empty() 方法来删除元素
empty() 方法: 删除被选元素下的所有子元素. 注意: 被选中的元素不会被删除.
示例:
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="utf-8">
- <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
- </script>
- <script>
- $(document).ready(function(){
- $("button").click(function(){
- $("div").empty();
- });
- });
- </script>
- </head>
- <body>
- <div style="height:100px;background-color:yellow">
这是一些文本.
- <p>
- 这是 div 块中的一个段落.
- </p>
- </div>
- <p>
- 这是 div 块外部的一个段落.
- </p>
- <button>
- 移除 div 块中的内容
- </button>
- </body>
- </HTML>
效果图:
更多 web 开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/jquery/16892.html