jquery中each的全⾯⽤法
看了优秀的代码,发现⽤for的很少⽽⽤each的很多,因为each是在for的基础上⾯进⾏的封装,但是有的是
$.each(vipCourse.has_course_vip, function(j, key2) {}这是什么意思?看不懂,经过学习总结如下,⼤家如果有什么好的建议,欢迎多多留⾔:
each有两种⽤法:
第⼀种是:$.each(object,callback); object可以是数组,js对象,dom对象,json对象
第⼆种是:$(selector).each(callback);  callback是回调函数,跳出使⽤return false;return true和continue                  的⽤法⼀样,但是在each中只能使⽤return true;
callback的实体就是 function(index,element);
index:遍历的索引位置,从0开始,如果为json对象或对象属性,则此值为对应的key值或属性;
element:遍历得到的对象元素();
官⽅对each的解释是:
以每⼀个匹配的元素作为上下⽂来执⾏⼀个函数。意味着,每次执⾏传递进来的函数时,函数中的this关键字都指向⼀个不同的DOM元素(每次都是⼀个不同的匹配元素)。⽽且,在每次执⾏函数时,都会给函数传递⼀个表⽰作为执⾏环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整形)。返回 'false' 将停⽌循环 (就像在普通的循环中使⽤ 'break')。返回 'true' 跳⾄下⼀个循环(就像在普通的循环中使⽤'continue')。
⽰例代码:
遍历数组
// 定义⼀个⼀维数组
var names = ["张三","李四","王五"];
// ⼀维数组each读取
$("#each1Btn").click(function(){
clearHtml();
// 回调函数的参数说明:
// i:数组索引,从0开始
// obj:遍历得到的对象,可使⽤this代替,本例中为students⾥的元素
/**
// 第⼀种使⽤⽅式:
$.each(names, function(i, obj) {
$("#showContent").append("<br/>第"+i+"个元素为:"+obj);
});
*/
// 第⼆种使⽤⽅式:
// $(Object).each(callback);
$(names).each(function(i, obj) {
$("#showContent").append("<br/>第"+i+"个元素为:"+this);
});
});
遍历字符串对象
// 字符串对象遍历
$("#eachObjBtn").click(function(){
clearHtml();
var str = "G2room测试each遍历字符串";
// 此时的obj为字符串的字符
// 如果为数字或布尔,则⽆法遍历
$.each(str, function(i, obj) {
$("#showContent").append("<br/>"+obj);
});
});
遍历dom对象
// DOM对象遍历
$("#eachDomBtn").click(function(){
clearHtml();
// 此时传⼊的对象为Jquery对象
// 此时obj获取的DOM对象,如果要进⾏Jquery操作,需要转换为Jquery对象
// 如下例中,可以使⽤$(obj).val()获取值
$.each($("input[name='category']"), function(i, obj) {
$("#showContent").append("<br/>Radio的值为:"+obj.value);
if($(obj).attr("checked")) {
$("#showContent").append(",已选中");
}
});
});
遍历json对象
// DOM对象遍历
$("#eachDomBtn").click(function(){
clearHtml();jquery源码在线
/
/ 此时传⼊的对象为Jquery对象
// 此时obj获取的DOM对象,如果要进⾏Jquery操作,需要转换为Jquery对象// 如下例中,可以使⽤$(obj).val()获取值
$.each($("input[name='category']"), function(i, obj) {
$("#showContent").append("<br/>Radio的值为:"+obj.value);
if($(obj).attr("checked")) {
$("#showContent").append(",已选中");
}
});
});
each对javascript的for循环做了封装,附上Jquery源码如下
function( obj, callback, args ) {
var value,
i = 0,
length = obj.length,
isArray = isArraylike( obj );
if( args ) {
if( isArray ) {
for( ; i < length; i++ ) {
value = callback.apply( obj[ i ], args );
if( value === false) {
break;
}
}
} else{
for( i in obj ) {
value = callback.apply( obj[ i ], args );
if( value === false) {
break;
}
}
}
// A special, fast, case for the most common use of each
} else{
if( isArray ) {
for( ; i < length; i++ ) {
value = callback.call( obj[ i ], i, obj[ i ] );
if( value === false) {
break;
}
}
} else{
for( i in obj ) {
value = callback.call( obj[ i ], i, obj[ i ] );
if( value === false) {
break;
}
}
}
}
return obj;
}
本⽂转载⾄:g2room/index.php/archives/62

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。