删除元素有两种方法

remove():删除被选元素(及其子元素)

empty():从被选元素中删除子元素

remove()代码如下:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>删除元素</title><style>p{cursor: pointer;}</style>
</head>
<body><p>这是一个段落,点击此处将会删除这段文字</p><!-- <ul id="box"><li>li1</li><li class="lis">li2</li><li class="lis">li3</li></ul> --> <script src="../jquery-3.6.0.js"></script><script>$1(document).ready(function(){$('p').click(function(){this.remove();});})</script>
</body>
</html>

当点击了p段落时,p元素会被删除

效果如下图:

remove方法也可以用于过滤被删除的元素

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>empty()</title><style>#box{margin: 0;padding: 0;width: 200px;height: 100px;background-color: burlywood;border: 1px solid black;margin-bottom: 10px;}#box li{box-sizing: border-box;padding-top: 10px;text-align: center;list-style: none;}</style>
</head>
<body><ul id="box"><li>li1</li><li class="lis">li2</li><li class="lis">li3</li></ul><button>当点击按钮时清空li</button><script src="../jquery-3.6.0.js"></script><script>$(document).ready(function(){$('button').click(function(){$('li').remove('.lis');})})</script>
</body>
</html>

过滤效果如下:

empty():从被选元素中删除其中的子元素

将此代码引入上方代码段即可

$('button').click(function(){

$('#box').empty();

})

注意:是从被选中元素中删除其中的 子元素 

效果如下:

jQuery-删除元素相关推荐

  1. jQuery删除元素---remove()与empty()

    jQuery删除元素-remove()与empty() remove() - 删除被选元素(及其子元素) empty() - 从被选元素中删除子元素 举例:remove() <script> ...

  2. jQuery - 删除元素

    通过 jQuery,可以很容易地删除已有的 HTML 元素. 删除元素/内容 如需删除元素和内容,一般可使用以下两个 jQuery 方法: remove() - 删除被选元素(及其子元素) empty ...

  3. JQuery删除元素

    detach:从DOM中删除匹配的元素集.可以选择性的接受一个选择器表达式来过滤元素集中的元素.此方法返回与被删除元素关联的jQuery数据.eg:删除id为test的p元素可以写成$("p ...

  4. jQuery 删除元素

    通过 jQuery,可以很容易地删除已有的 HTML 元素. 删除元素/内容 如需删除元素和内容,一般可使用以下两个 jQuery 方法: remove() - 删除被选元素(及其子元素) empty ...

  5. jQuery学习--jQuery 删除元素

    删除元素/内容 jQuery remove() 方法 jQuery remove() 方法删除被选元素及其子元素. remove() 方法移除被选元素,包括所有的文本和子节点. 该方法也会移除被选元素 ...

  6. jQuery删除元素或内容

    删除元素/内容 remove():删除被选元素 empty():删除被选元素中子元素

  7. jQuery删除元素的三中方法的区别:detach()、remove()、empty()

    detach() 移除被选元素,包括所有文本和子节点. 该方法会保留移除元素的副本,允许它们在以后被重新插入.(这个方法会保留 jQuery 对象中的匹配的元素,因而可以在将来再使用这些匹配的元素.d ...

  8. jQuery删除元素方法remove(),detach(),empty()

    1.empty() 它是清空节点,但是那些节点的标签还在. 结果是:p里面的都被删除了,而不是只有 class为hello的p 2.remove()  从DOM中删除所有匹配的元素. 这个方法不会把匹 ...

  9. jquery 删除元素的onclick事件

    网上很多的资料中有一种方法: obj.unbind("click", openFavorite);//取消绑定onclick事件,但有时好像不起作用. 后来发现一种方法: obj. ...

  10. jQuery HTML 添加和删除元素

    jQuery - 添加元素 通过 jQuery,可以很容易地添加新元素/内容. 添加新的 HTML 内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepend() ...

最新文章

  1. Xcode:Task failed with exit 1 signal 0 {
  2. ise 时钟约束_「新手入门」ISE工程升级到Vivado及板级信号调试技术
  3. java byte 判断相等_转发收藏 | 史上最全Java面试题+面试网站推荐!(含答案)
  4. 递归法实现库函数strlen
  5. 统计字符串中某个字出现的次数
  6. lisp医院化验系统_医院智能导视系统
  7. 省选+NOI 第五部分 高级数据结构
  8. linux怎么打开pak文件怎么打开,在elementary OS系统中开启Flatpak应用程序支持
  9. 字节数与字符数mysql_mysql 数值与字符类型 长度梳理
  10. Convert Sorted List to Balanced Binary Search Tree leetcode
  11. 窗口设置固定的尺寸(pyqt qt for python)
  12. 强化学习之DQN(附莫烦代码)
  13. 自然语言处理(NLP)
  14. word上下的横线怎么去掉_word文档上面有一条横线怎么去掉
  15. php gd测试代码,PHP gd_info()用法及代码示例
  16. 实现px和vw的转换
  17. 程序猿怎样选择机械键盘
  18. 中国OpenAI?李志飞放弃了;AutoGPT试玩指南;AI大时代的家长完整手册;电商数字模特生成实践 | ShowMeAI日报
  19. 路由器密码忘记了?三步帮你重置找回!
  20. MySQL数据库 sql语句及其含义

热门文章

  1. luoojP1661生死大逃亡
  2. c:out标签的escapeXml=false和动态格式的数据
  3. python适合开发游戏吗_python能开发游戏吗
  4. 什么是cool域名?
  5. 【Python】好友管理系统
  6. 现有的分词算法,主要分为哪三大类?
  7. 警惕加盟骗子~~北京艾妃儿伟业美容用品有限公司
  8. 关于国家自然科学基金模板无法使用word自带的公式编辑器问题的解决办法
  9. extjs5 中propertygrid修改样式以及数据更新
  10. 手机大战略的游戏设计(1)