html代码:
<body> <span class="name">11span>br> <span class="name">22span>br> <span class="name">33span>br> <span class="name">44span>br> <input type="button" id="in"> body>
(一)dom对象数组的遍历
var s=document.getElementsByClassName("name");
(1)第一种
for(var i in s){
alert(s[i].innerText+"dom");}
(2)第二种
for(var i=0;i< s.length;i++){
alert(s[i].innerText+"dom");}
(3)第三种
$.each(s,function(i,v){
alert(s[i].innerText);
alert(v.innerText);
alert(this.innerText);
});
(二)jQuery对象数组的遍历
var span=$(".name");
思路:不能使用像dom对象的s[i]这样中括号方式遍历,使用eq(i)与each()方法
(1)第一种
span.each(function(){
alert($(this).text()+"1");
alert(this.innerText+"2");
});
(2)第二种
span.each(function(i){
alert(span.eq(i).text()+"1");
alert(this.innerText+"2");
});
(3)第三种
span.each(function(i,v){
alert(v.innerText+"1");
alert(this.innerText+"2");
});
(4)第四种
$.each(span,function(i){
alert($(this).text()+"1");
//alert(span.eq(i).text());
alert(span.get(i).innerText);
}
总结(1):$.each(s,function(i,v){}); 既能遍历dom,又能遍历jQuery,其他的方式是各自独有的方式。但是
$().each(s,function(i,v){}); 是jQuery对象独有的。
(2):jQuery对象转换成dom对象。 span.get(i).innerText
(3): $(this) 代表的是当前被操作的jQuery一个对象。this代表的是当前被操作的dom对象