博客列表 >jquery元素和元素内容的删除操作

jquery元素和元素内容的删除操作

梁凯达的博客
梁凯达的博客原创
2018年05月23日 08:24:00934浏览

jquery元素和元素内容的操作方法主要有:

1、remove():用于删除掉整个元素

2、empyt():用于删除掉元素的内容部分

知识点补充:

filter():方法将匹配的元素集合缩减到指定的元素范围

//

代码部分

<!DOCTYPE html>

<html>


<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<meta http-equiv="X-UA-Compatible" content="ie=edge" />

<title>Document</title>

</head>

<style type="text/css">

.buttonyellow {

background: yellow;

}


.buttongreen {

background: green;

}

</style>


<body>


<ul>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

<li>

<a href="">这是一个a标签</a>

</li>

</ul>

<button>removr操作删除元素</button>

<button>empty操作删除内容</button>

</body>

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">

//方法1:remove():用于删除掉整个元素

//备注:方法filter(),用于将匹配元素集合缩减到指定的元素

$('button').eq(0).on('click',function(){

$('li').filter('.buttonyellow').remove()

})

//方法2:empty():用于删除掉元素的内容部分,仅删除内容但保留了元素

$('button').eq(1).on('click',function(){

$('li').filter('.buttongreen').empty()

})

</script>


</html>


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议