一、对元素进行遍历操作
如果要遍历一个jquery对象,对其中每个匹配元素进行相应处理,那么可以使用each()方法。
$("div").each(function(index,element){
$(this).css("border":"6px solid black");
})
2.增加判断条件
$("div").each(function(index){
if(index!=2&&index<5)
$(this).css("border","6px solid black");
})
3.执行each()方法里面的函数时,如果返回false,则停止循环,效果等价于javascript中的break;如果返还true,则直接进入下一个循环,等价于javascript中的contiune;
$("div").each(function(index){
if(index==2) return true;
if(index==5) return false;
$(this).css("border","6px solid black");
})
4.对元素进行数据存取
1.将数据存储在文本里面
var flag=true;
$("#btn1").click(function(){
if(flag){
$("p").text("true");
flag==false;
}else{
$("p").text("false");
flag=true;
}
})
2.在元素上存储数据
将数据存储在元素的属性里面
$("p").attr("alt","false");
$("#btn2").click(function(){
if($("p").attr("alt")=="true"){
$("p").text("true").attr("alt","false");
}else{
$("p").text("false").attr("alt","true");
}
})
3.将数据存储在元素data方法的参数中
语法:data("变量名",变量值);
$("p").data("flag",false);
$("#btn2").click(function(){
if($("p").data("flag")){
$("p").text("true").data("flag",false);
}else{
$("p").text("false").data("flag",true);
}
})
4.克隆元素同时克隆数据
方法:clone():不带参数,值复制元素,不会复制元素上绑定的事件和数据。
clone(true)方法:复制元素的同时,复制元素上绑定的事件和数据。
$("p:first").clone().insertAfter($("p:eq(0)"));
$("p:first").clone(true).insertAfter($("p:eq(1)"));
alert($("p:eq(1)").data("test1"));//undefined
alert($("p:eq(2)").data("test1"));//true
5.清除附加在元素上的变量:removeData()
$("p").data("test1",true).data("test2",{first:1,last:"two"});
创建变量test1,且复制为true;创建变量test2且赋值为{first:1,last:"two"};
$("p").removeData("test1");
alert($("p").data("test1"));输出为undefined
alert($("p").data("test2").first);//1
alert($("p").data("test2").last);//two
如果要清楚元素上的全部变量使用removeData()不带参数,等价的方法有remove()和empty()方法。
二、元素的个数和索引
1.size()方法:计算jq对象中的元素的个数
--length()
2.index()方法:返回某个元素相对于其他兄弟元素的索引位置
index()不带参数,他会计算第一个匹配选择器的元素的相对于其他兄弟的索引位置
$("#core").index();