JQuery总结
一、jQuery介绍
1、jQuery是一个轻量级的、兼容多浏览器的JavaScript库。
2、jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互,能够极大地简化JavaScript编程。它的宗旨就是:“Write less, do more.“
jQuery引入
首先需要jQuery官网下载jQuery的文件,然后在HTML文件中引入这个文件,就可以使用这个文件中帮我们提供的jquery的接口了。
<script src="jQuery.js"></script>
二、jQuery对象和DOM对象
jQuery 找到的标签对象称为 ——> jQuery对象
原生 JS 找到的标签对象称为 ——> DOM对象
DOM对象只能使用DOM对象的方法,不能使用jQuery对象的方法
jQuery对象也是,它不能使用DOM对象的方法
我们在声明一个jQuery对象变量的时候在变量名前面加上$:
var $variable = jQuery对像;
var variable = DOM对象;
jQuery对象转成DOM对象,通过一个jQuery对象+[0]索引零,就变成了DOM对象,就可以使用JS的代码方法了,DOM对象转换成jQuery对象:$(DOM对象),通过$符号包裹一下就可以了
$variable[0];
DOM 对象和 jQuery 对象互相转换:
jQuery对象转DOM对象 ——> jQuery对象[0] 示例:$('#d1')[0]
DOM对象转jQuery对象 ——> $(dom对象)
三、jQuery选择器
不管找什么标签,用什么选择器,都必须要写$(""),引号里面再写选择器,通过jQuery找到的标签对象就是一个jQuery对象,用原生JS找到的标签对象叫做DOM对象
选择器找到的可能是多个标签,会放到数组里面,但还是jquery对象,能够直接使用jquery的方法,意思是找到的所有标签进行统一设置,如果要单独设置选中的所有标签中的某个标签,可以通过索引取值的方式找到,然后注意,通过索引取值拿到的标签,是个dom对象
基本选择器
和css一样
id选择器:
$("#id");
标签选择器:
$("tagName");
class选择器:
$(".className");
配合使用:
$("div.c1"); // 找到有c1 class类的div标签
所有元素选择器:
$("*");
组合选择器:
$("#id, .className, tagName");
层级选择器
和css一样
x 和 y 可以为任意选择器
$("x y"); // x 的所有后代 y(子子孙孙)
$("x > y"); // x 的所有儿子 y(儿子)
$("x + y"); // 找到所有紧挨在 x 后面的 y
$("x ~ y"); // x 之后所有的兄弟 y
基本筛选器
选择之后进行过滤筛选
方式一:
:first // 第一个
:last // 最后一个
:eq(index) // 索引等于index的那个元素
:even // 匹配所有索引值为偶数的元素,从 0 开始计数
:odd // 匹配所有索引值为奇数的元素,从 0 开始计数
:gt(index) // 匹配所有大于给定索引值的元素
:lt(index) // 匹配所有小于给定索引值的元素
:not(元素选择器) // 移除所有满足not条件的标签
:has(元素选择器) // 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)
// 找到所有后代中有h1标签的div标签,意思是首先找到所有div标签,把这些div标签的后代中有h1的div标签筛选出来
$("div:has(h1)")
// 找到所有后代中有c1样式类(类属性class='c1')的div标签
$("div:has(.c1)")
$("li:not(.c1)") // 找到所有不包含c1样式类的li标签
$("li:not(:has(a))") // 找到所有后代中不含a标签的li标签
例子:
<ul>
<li id="1">上海</li>
<li id="2">成都</li>
<li id="3">泸州</li>
<li id="4">雅安</li>
<li id="5">北京</li>
</ul>
$('li:first'); // 查找所有li标签中的第一个标签
方式二:
和前面使用冒号的一样 :first等,只不过冒号的那个是写在选择器里面的,而下面的这几个是方法
.first() // 获取匹配的第一个元素
.last() // 获取匹配的最后一个元素
.not() // 从匹配元素的集合中删除与指定表达式匹配的元素
.has() // 保留包含特定后代的元素,去掉那些不含有指定后代的元素。
.eq() // 索引值等于指定值的元素
$('li').first(); // 查找所有li标签中的第一个标签
属性选择器
[attribute]
[attribute=value] // 属性等于
[attribute!=value] // 属性不等于
例子:多用于input标签
<input type="text">
<input type="password">
<input type="checkbox">
$("input[type='checkbox']"); // 取到checkbox类型的input标签
$("input[type!='text']"); // 取到类型不是text的input标签
表单筛选器
多用于找form表单里面出现的input标签
找到的是type属性为这个值的input标签中
:text
:password
:file
:radio
:checkbox
:submit
:reset
:button
例子:多用于input标签
<input type="text">
<input type="password">
<input type="checkbox">
$(':password') // 找到input标签中type属性为password的标签
表单对象属性筛选器
:enabled // 可用的标签
:disabled // 不可用的标签
:checked // 选中的input标签
:selected // 选中的option标签
例子1:
<input type="text" disabled="disabled">
<input type="password">
$("input:enabled") // 找到可用的input标签
例子2:
<select id="s1">
<option value="1">北京</option>
<option value="2">四川</option>
<option selected value="3">云南</option> // 默认选中
<option value="4">深圳</option>
</select>
$(":selected") // 找到所有被选中的option
筛选器方法
选择器或者筛选器选择出来的都是对象,而筛选器方法其实就是通过对象来调用一个进一步过滤作用的方法,写在对象后面加括号,不再是写在选择器里面的了。
下一个:
$('#l3').next(); // 找到下一个兄弟标签
$('#l3').nextAll(); // 找到下面所有的兄弟标签
$('#l3').nextUntil('#l5'); // 往下直到找到id为l5的标签,不包含它
上一个:
$("#id").prev() // 找到上一个兄弟标签
$("#id").prevAll() // 找到上面所有的兄弟标签
$("#id").prevUntil("#i2") // 往上直到找到id为i2的标签,不包含它
父亲元素:
$("#id").parent() // 查找当前元素的父亲元素
$("#id").parents() // 查找当前元素的所有的父辈元素(爷爷辈、祖先辈都找到)
$("#id").parentsUntil('body')
// 查找当前元素的所有的父辈元素,直到遇到匹配的那个元素为止,这里直到body标签,不包含body标签,基本选择器都可以放到这里面使用。
儿子和兄弟元素:
$('ul').children(); // 找到当前标签的所有儿子标签
$('ul').children('#l3'); // 找到符合后面这个选择器的儿子标签
$('#l5').siblings(); // 找到兄弟们,不包含自己
$('#l5').siblings('#l3'); // 找到符合后面这个选择器的兄弟标签
查找:find
搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。
$('ul').find('#l3'); --> 类似于 $('ul #l3')
过滤:filter
和find不同,find是找div标签的子子孙孙中找到一个符合条件的标签
// 从结果集中过滤出有c1样式类的,从所有的div标签中过滤出有class='c1'属性的div
('li').filter('.l3');
四、标签操作
样式操作
样式类操作:
addClass(); // 添加指定的CSS类名。
removeClass(); // 移除指定的CSS类名。
hasClass(); // 判断样式存不存在
toggleClass(); // 切换CSS类名,如果有就移除,如果没有就添加。
例子:
$('div.c1').addClass('c2');
$('div.c1').removeClass('c2');
$('div.c1').hasClass('c2');
$('div.c1').toggleClass('c2');
CSS样式:
// 原生js
标签.style.backgroundColor = 'black';
// jQuery
$('.c1').css('background-color','red');
// 同时设置多个css样式
$('.c1').css({'background-color':'yellow','width':'200px'})
位置操作:
.offset()
方法允许我们检索一个元素相对于文档(document)的当前位置。
.position()
的差别在于: .position()
获取相对于它最近的具有相对位置(position: relative 或 position: absolute)
的父级元素的距离,如果找不到这样的元素,则返回相对于浏览器界面左上角的距离。
offset() // 获取匹配元素在当前窗口的相对偏移或设置元素位置
position() // 获取匹配元素相对父元素的偏移,不能设置位置
$(window).scrollTop(); // 滚轮向下移动的距离
$(window).scrollLeft(); // 滚轮向左移动的距离
// 查看位置
$('.c2').position(); // 查看相对于父级元素位置
$('.c2').offset(); // 查看距离窗口左上角的绝对位置
// 设置位置
$('.c2').offset({'top':'20','left':'40'});
尺寸操作:
// 与盒子模型相关
$('.c1').height(); // content 高度
$('.c1').width(); // content 宽度
$('.c1').innerHeight(); // content 高度 + padding高度
$('.c1').innerWidth(); // content 宽度 + padding宽度
$('.c1').outerHeight(); // content 高度 + padding高度 + border高度
$('.c1').outerWidth(); // content 宽度 + padding宽度 + border宽度
文本操作
HTML:
html() // 取得第一个匹配元素的html内容,包含标签内容
html(val) // 修改所有匹配元素的html内容,识别标签,能够表现出标签的效果
文本值:
text() // 取得所有匹配元素的内容,只有文本内容,没有标签
text(val) // 修改所有匹配元素的内容,不识别标签,将标签作为文本插入进去
例子:
$('.c1').text('<h3>hello Word</h3>');
$('.c1').html('<h3>hello Word</h3>');
值操作
val() // 取得第一个匹配元素的当前值
val(val) // 修改所有匹配元素的值
val([val1, val2]) // 修改多选的checkbox、多选select的值
实例一:获取值
<input type="text" class="c1"> ————>获取值:$('.c1').val();
<input type="checkbox" value="1">
// 获取被选中的值这样是不行的:$(':checkbox:checked').val();
// 需要循环取值
var d = $(':checkbox:checked');
for (var i=0;i<d.length;i++){
console.log(d.eq(i).val());
}
单选select ---> $('#city').val();
多选select ---> $('#author').val(); // ["2", "3"]
实例二:设置值
<input type="text" class="c1"> ——>设置值:$('.c1').val('小杨');
<input type="checkbox" value="1"> ——>设置值:$(':checkbox').val([1,3]);
// 如果直接:$(':checkbox').val(1);这样的话会把所有的的value全部设置为1
单选select ---> $('#city').val('1'); // 或者——> option value='1'
多选select ---> $('#author').val(['2','3']);
属性操作
用于ID自带属性等或自定义属性:
attr(attrName) // 返回第一个匹配元素的属性值
attr(attrName, attrValue) // 为所有匹配元素设置一个属性值
attr({k1: v1, k2:v2}) // 为所有匹配元素设置多个属性值
removeAttr(attrName) // 从每一个匹配的元素中删除一个属性
用于checkbox和radio
prop() // 获取属性
实例:
// 设置单个属性
$('.c1').attr('id','d1');
// 设置多个属性
$('.c1').attr({name:'xiao',id:'d1'});
// 查看属性
$('.c1').attr('属性名');
// 删除属性
$('.c1').removeAttr('属性名');
// prop ——> 针对的是checked\selected\disabled
// 查看标签是否有checked属性,也就是是否被选中
attr ————> $(':checked').attr('checked'); // 返回:选中(checked),没选中(undefined)
prop ————> $(':checked').prop('checked'); // 返回:选中(true),没选中(false)
// 通过设置属性的方式来设置是否选中:
$(':radio').eq(2).prop('checked',true); // true和false不能加引号
$(':radio').eq(2).prop('checked',false);
prop和attr的区别:
attr全称attribute(属性)
prop全称property(属性)
虽然都是属性,但他们所指的属性并不相同,attr所指的属性是HTML标签属性,而prop所指的是DOM对象属性,可以认为attr是显式的,而prop是隐式的。
简单总结:
1、对于标签上有的能看到的属性和自定义属性都用attr
2、对于返回布尔值的比如checkbox、radio和option的是否被选中或者设置其被选中与取消选中都用prop。
具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()
文档操作
添加到指定元素--内部的后面
$(A).append(B) // 把B追加到A
$(A).appendTo(B) // 把A追加到B
实例:
// 添加字符串照样能识别标签
$('#d1').append('<a href="http://www.jd.com">京东</a>');
添加到指定元素--内部的前面
$(A).prepend(B) // 把B前置到A
$(A).prependTo(B) // 把A前置到B
实例:
// 添加字符串照样能识别标签
$('#d1').perpend('<a href="http://www.jd.com">京东</a>');
添加到指定元素--外部的后面
$(A).after(B) // 把B放到A的后面
$(A).insertAfter(B) // 把A放到B的后面
实例:
// 添加字符串照样能识别标签
$('#d1').after('<a href="http://www.jd.com">京东</a>');
添加到指定元素--外部的前面
$(A).before(B) // 把B放到A的前面
$(A).insertBefore(B) // 把A放到B的前面
移除和清空元素
remove() // 从DOM中删除所有匹配的元素。
empty() // 删除匹配的元素集合中所有的子节点,包括文本被全部删除,但是匹配的元素还在
实例:
$('div').remove(); // 移除div标签
$('div').empty(); // 清空div标签中的所有内容
替换
replaceWith()
replaceAll()
实例:
var a = document.createElement('a')
a.href = 'http://www.baidu.com';
a.innerText = '百度';
// 写法不一样效果一样
$('div').replaceWith(a); // 将所有的div标签替换成a标签
$(a).replaceAll('div'); // 将所有的div标签替换成a标签
克隆
clone() // 克隆
实例:
<button class="btn">按钮</button>
<script>
$('.btn').click(function (){
// var a = $(this).clone(); // 克隆标签
var a = $(this).clone(true); // 连带事件一起克隆
$(this).after(a)
})
</script>
五、事件
事件绑定方式
方式一:
<style>
.c1{
height: 100px;
width: 100px;
background: red;
}
</style>
<div class="c1"></div>
<script>
$('.c1').click(function () {
$(this).css({backgroundColor:'green'})
})
</script>
方式二:
<style>
.c1{
height: 100px;
width: 100px;
background: red;
}
</style>
<div class="c1"></div>
<script>
$('.c1').on('click', function () {
$(this).css({backgroundColor:'green'})
})
</script>
常用事件
click(function(){...}) // 左键点击的事件
hover(function(){...}) // 鼠标悬浮触发的事件
blur(function(){...}) // 失去光标(焦点)触发的事件
focus(function(){...}) // 获取光标触发的事件
change(function(){...}) // 内容发生变化,input,select等
keyup(function(){...}) // 键盘抬起触发的事件
keydown(function(){...}) // 键盘按下触发的事件
**左键点击的事件:click **
$('.c1').click(function () {
$(this).css({backgroundColor:'green'})
})
获取光标触发的事件:focus —— 失去光标(焦点)触发的事件:blur
<style>
.c1{
height: 100px;
width: 100px;
background: red;
}
</style>
<div class="c1" ></div>
<input type="text">
<script>
$('[type="text"]').focus(function () { // 获取光标事件
$('.c1').css({backgroundColor:'green'})
})
$('[type="text"]').blur(function () { // 失去光标事件
$('.c1').css({backgroundColor:'red'})
})
</script>
域内容发生改变时触发的事件:change ——内容发生变化,input,select等
<select name="" id="d1">
<option value="1">成都</option>
<option value="2">北京</option>
<option value="3">上海</option>
</select>
<script>
$('#d1').change(function () {
console.log($(this).val())
})
</script>
input 实时监听事件:只要input框里面的值发生变化就触发某个事件,input事件不能直接绑定,必须用on绑定才行
<input type="text" id="d1">
<script>
$('#d1').on("input", function () {
console.log($(this).val())
})
</script>
鼠标悬浮触发的事件:hover
<style>
.c1{
height: 100px;
width: 100px;
background: red;
}
</style>
<div class="c1"></div>
<script>
$('.c1').hover(
// 第一步:鼠标放上去
function () {$(this).css({backgroundColor: 'yellow'});},
// 第二步:鼠标移走
function () {$(this).css({backgroundColor: 'red'});}
)
</script>
鼠标悬浮触发的事件:mouseenter、mouseout——等同于hover
mouseover 和 mouseenter 的区别是:mouseover事件是如果该标签有子标签,那么移动到该标签或者移动到子标签时会连续触发,mmouseenter事件不管有没有子标签都只触发一次,表示鼠标进入这个对象
<style>
.c1{
height: 100px;
width: 100px;
background: red;
}
</style>
<div class="c1"></div>
<script>
// 第一步:鼠标放上去
$('.c1').mouseenter(function () {
$(this).css({backgroundColor: 'yellow'})
})
// 第二部:鼠标移走
$('.c1').mouseout(function () {
$(this).css({backgroundColor: 'red'})
})
</script>
键盘按下触发的事件:keydown
$(window).keydown(function (e) {
console.log(e.keyCode); //每个键都有一个keyCode值,通过不同的值来触发不同的事件
})
键盘抬起触发的事件:keyup
$(window).keyup(function (e) {
console.log(e.keyCode);
})
移除事件:. off
.off( events [, selector ][,function(){}])
1.events: 事件
2.selector: 选择器(可选的)
3.function: 事件处理函数
off() 方法移除用 .on()绑定的事件处理程序。
$("li").off("click");就可以了
事件冒泡
冒泡的意思就是因为HTML可以嵌套,如果你给儿子标签绑定了事件或者没有绑定点击事件,父级标签绑定了点击事件,那么你一点击子标签,不管子标签有没有绑定事件,都会触发父级标签的点击事件,如果有,会先触发子标签的点击事件,然后触发父级标签的点击事件,不管子标签有没有点击事件,都会一级一级的往上找点击事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#d1{
background-color: red;
height: 200px;
}
#d2{
background-color: green;
height: 100px;
width: 100px;
}
</style>
</head>
<body>
<div id="d1">
<div id="d2"></div>
</div>
<script src="jquery.js"></script>
<script>
$('#d1').click(function () {
alert('父级标签');
});
$('#d2').click(function () {
alert('子级标签');
});
</script>
</body>
</html>
阻止事件冒泡
就是为了阻止后续事件发生
1、return false;
$('#d1').click(function () {
alert('父级标签');
});
$('#d2').click(function () {
alert('子级标签');
return false
});
2、e.stopPropagation( );
用事件对象的这个方法就能阻止冒泡 (Propagation:传递的意思)
$('#d1').click(function () {
alert('父级标签');
});
$('#d2').click(function (e) { // 这个参数e(只是个形参)表示当前事件本身,这个事件也是一个对象
alert('子级标签');
e.stopPropagation();
});
事件委托
事件委托是通过事件冒泡的原理,利用父标签去捕获子标签的事件,给未来将要添加进来的某些子标签自动绑定上事件。
例一:没有事件委托,只有第一个按钮可以触发事件,其他新添加的按钮虽然 class=c1 但是不能触发事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="cc">
<button class="c1">添加按钮</button>
</div>
<script src="jQuery.js"></script>
<script>
$('.c1').click(function () {
var btn = document.createElement("button"); // 新建button标签
btn.innerText = '添加按钮';
btn.className = 'c1' // 给新标签添加class=c1
$(this).after(btn); // 把新标签放在自己的后面
})
</script>
</body>
</html>
列二:设置事件委托,每个新增按钮都可以触发事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="cc">
<button class="c1">添加按钮</button>
</div>
<script src="jQuery.js"></script>
<script>
// 将 'button.c1' 选择器中的标签的点击事件委托给了 $('div.cc')
$('div.cc').on('click','button.c1',function () {
var btn = document.createElement("button");
btn.innerText = '添加按钮';
btn.className = 'c1'
$(this).after(btn);
})
</script>
</body>
</html>
六、补充
页面载入
JS 代码写到head标签和写道 body 标签下面的作用是不同的,写在 head 标签里面的话,如果你写了操作某个标签的内容的话,那个标签还没加载出来,先加载了你的 JS 代码,就找不到这个标签,所以不会生效,所以写在 body 标签最下面是一种解决办法,但还有另外两种方法:
方法一 :等页面上所有的元素都加载完,在执行这里面的 JS 代码
缺点:如果你自己写了两个 JS 文件,每个 JS 文件中都有一个 window.onload 的话,那么后引入的文件会把前面引入的文件的 window.onload 里面的 JS 代码全部覆盖掉,也会等到页面上的文档、图片、视频等所有资源都加载完才执行里面的 JS 代码,加载比较慢
window.onload=function(){
// JS的代码
}
方法二(推荐):不存在覆盖问题,而且只要文档加载完就触发,不需要等着一些图片视频什么的,加载 JS 效果的速度快。
// 写法一:
$(document).ready(function(){
// JS的代码
})
// 写法二:简写
$(function(){
// JS代码
})
$(document).ready 与 window.onload( ) 的区别
1、window.onload() 函数有覆盖现象,必须等待着图片资源加载完成之后才能调用
2、$(document).ready 的这个入口函数没有函数覆盖现象,文档加载完成之后就可以调用(建议使用此函数)
动画效果
基本动画
show() --> $('.c1').show(5000) // 5秒之后显示这个标签,显示过程有个动画
hide() --> $('.c1').hide(5000) // 5秒之后这个标签消失,消失过程有个动画
滑动(拉窗帘一样)
slideDown() --> $('.c1').slideDown(5000)
slideUp() --> $('.c1').slideUp(5000)
slideToggle() --> $('.c1').slideToggle(5000) // 前两个互相切换
淡入淡出(控制透明度)
fadeIn() -->$('.c1').fadeIn(5000)
fadeOut() -->$('.c1').fadeOut(5000)
fadeTo() -->$('.c1').fadeTo(5000,0.2) // 0.2是最后显示透明度
fadeToggle() -->$('.c1').fadeToggle(5000) // 前两项互相切换
each 循环
$.each (可迭代对象,function (k,v) { 迭代结果操作 } )
function 里面可以接受两个参数,K 是索引,V 是每次循环的具体元素。
实例一:获取选中的值
<input type="checkbox" value="1">一
<input type="checkbox" value="2">二
<input type="checkbox" value="3">三
<input type="checkbox" value="4">四
<input type="checkbox" value="5">五
$.each($(':checkbox:checked'),function(k,v){
console.log(k,v.value);
})
// 输出
0 "2"
1 "4"
2 "5"
实例二:
var li =[10,20,30,40]
$.each(li,function(k, v){
console.log(k, v);
})
// 输出
0 10
1 20
2 30
3 40
.each ( function (k,v) { 迭代结果操作 } )
描述:遍历一个jQuery对象,为每个匹配元素执行一个函数。
K 是索引,V 是每次循环的具体元素。
// 由于回调函数是在当前DOM元素为上下文的语境中触发的,所以关键字 this 总是指向这个元素。
// 为每一个li标签加class
$("li").each(function(){
$(this).addClass("c1");
});
注意: jQuery的方法返回一个jQuery对象,遍历jQuery集合中的元素 -- 被称为隐式迭代的过程。当这种情况发生时,它通常不需要显式地循环的 .each()
方法:
也就是说,上面的例子没有必要使用each()方法,直接像下面这样写就可以了:
$("li").addClass("c1"); // 对所有标签做统一操作
终止 each 循环
在遍历过程中可以使用 return false
提前结束each循环。
而直接使用return
后面什么都不加,不写false
,就是跳过本次循环的意思。
JS 和 jQuery 中的 for 循环也是通过他们两个来跳出当此循环或者终止循环
实例一:return false
var a = [1,2,3,4,5,6,7,8]
$.each(a, function(k,v){
if (v > 3){ // 大于3就结束循环
return false;
}else{
console.log(v);
}
});
// 输出
1
2
3
实例二:return
var a = [1,2,3,4,5,6,7,8]
$.each(a, function(k,v){
if (v > 2 && v < 7){ // 在2-7之间的数字就跳过循环
return false;
}else{
console.log(v);
}
});
// 输出
1
2
7
8
.data( ) 方法
任意 jQuery 对象都有 data 方法,可以保存任意值,可以用来代替全局变量
.data(key, value):设置值
描述:在匹配的元素上存储任意相关数据。
$("div").data("age",18); //给所有div标签都保存一个名为age,值为18
.data(key):取值,没有的话返回undefined
描述: 返回匹配的元素集合中的第一个元素的给定名称的数据存储的值
$("div").data("age"); //返回第一个div标签中保存的"age"的值
可以保存标签
$('div.c1').data('a标签',$('a.c2'));
$('.c1').data('a标签').text(); -->百度
.removeData(key):删除
描述:移除存放在元素上的数据,不加key参数表示移除所有保存的数据。
$('.c1').removeData('a标签'); // 移除元素上存放’a标签‘对应的数据
本文来自博客园,作者:Mr-Yang`,转载请注明原文链接:https://www.cnblogs.com/XiaoYang-sir/articles/14850897.html