jquery遍历,数据存储、克隆、数据筛选、整合

129 阅读1分钟
	如果要遍历一个jQuery对象,对其中每个匹配元素进行相应的处理,那么可以使用each()方法。jq内核进行的是
    隐式迭代
	语法:$(“选择器”).each(function(index[,domelement]){
		});
	说明:对所有匹配选择器的元素逐个调用后面的函数。例如:$( "div" ).each(function(index,domele){
		$(this).css("border" :"6px solid black");
		//$(domele).css("border" :" 6px solid black” );
	});//遍历所有的div,并将其边框设置为6px黑色的实线。
1.在元素上存储数据
	将数据存储在元素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);
	})
克隆方法:
	clone()方法:不带参数,只复制元素,不会复制元素上绑定的事件和数据。
	clone(true)方法:复制元素的同时,复制元素上绑定的事件和数据。
	例如:$("p" ).data({ "test1" :true,"test2" :{first:1,last:"two"}});//创建变量test1,且复制为true;
        创建变量test2且赋值
        
	{first:1,last:" two"});
		$("p:first").clone().insertAfter($("p:eq(O)" ));
		$("p:first").clone(true).insertAfter($( "p:eq(1)"));
		alert($( "p:eq(1)" ).data("test1"));//输出undefined
		alert($( "p:eq(2)" ).data( "test1"));//输出true
                
3.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" ));//输出undefine
		alert($( "p" ).data( "test2" ).first);//输出1
		alert($( "p" ).data)("test2" ).last);//输出two
                
	如果要清除元素上的全部变量使用removeData()不带参数,等价的方法有remove()和empty()方法。
        
1.size()方法:计算jQuery对象中元素的个数。//对象中的lenght(长度)
	例如:$("p" ).size(); //4
        
2.index()方法:返回某个元素相对于其他兄弟元素的索引位置。

$(this).index();//获得当前单击的元素相同父亲下的div下标,在原生js中要用自定义属性获得

2.要遍历对象的数据并进行操作
$.each(obj,fn(name,value))
	例1:创建一个对象obj。使用$.each()方法遍历对象obj,将对象中每个属性名及值逐个在提示框中显示
		var obj={one:1, two:2, three:3, four:4, five:5};//创建一个对象obj
			$.each(obj, function(name, value){
				alert(name+":" +value);
		});
                
⒉.对数组中数据项进行筛选,返回一个新数组
$.grep(arr,fn(数据项,索引)
	例1:var arrOld=[9,2756,410381];
		var arrNew=$.grep(arrOld, function(n, i){
			return n>5&&i<6;
		);
		alert(arrNew);//输出9、7、6
3.要对数组中的数据项进行修改、删除、添加,来获得一个新的数组
$.map(arr,fn(数据项,索引))
例1:
	var arrOld=[123];
	var arrNew=$.map(arrOld, function(n, i){
		return n+i;
	});
	alert(arrNew);//输出1,3,5
        
         var arrOld = [2, 3, 4, 5, 6];
    var arr1 = $.map(arrOld, function (n, i) {//遍历数组
        return n;
    })
    var arr2 = $.map(arr2, function (n, i) {//添加元素
        return [n, n + 2];
    })
    console.log(arr2);
    var arr3=$.msp(arrOld,function(n,i){//删除元素
        return n>2?n:null4.$.merge(arr1,arr2):把两个数组中的数据项合并在一起,来获得一个新数组,$.merge(arr1,arr2),参数arr1
和arr2为需要被合并的数组。使用$.merge()方法时,不会光返回数组合并的结果,而且会向数组arr1添加数组arr2的数
据项,从而改变了数组arr1。
例1.
	var arrOld1=[123];
	var arrOld2=[3,45];
	var arrNew=$.merge(arrOld1, arrOld2);
	alert(arrNew);//输出:1,2,3,3,4,5
	alert(arrOld1);//输出:1,2,3,3,4,5
	alert(arrOld2);//输出3,4,5
        
5.要在数组中搜索某个数据值,
$.inArray(value,arr)
	var arr=[123];
	alert($.inArray(3, arr));//输出2var arr=[1,2,3];
	alert($.inArray(4, arr));//输出-1