each(callback)

返回值:jQueryeach(callback)

概述

以每一個匹配的元素作為上下文來執(zhí)行一個函數(shù)。

意味著，每次執(zhí)行傳遞進(jìn)來的函數(shù)時，函數(shù)中的this關(guān)鍵字都指向一個不同的DOM元素（每次都是一個不同的匹配元素）。而且，在每次執(zhí)行函數(shù)時，都會給函數(shù)傳遞一個表示作為執(zhí)行環(huán)境的元素在匹配的元素集合中所處位置的數(shù)字值作為參數(shù)（從零開始的整型）。 返回 'false' 將停止循環(huán) (就像在普通的循環(huán)中使用 'break')。返回 'true' 跳至下一個循環(huán)(就像在普通的循環(huán)中使用'continue')。

參數(shù)

callbackFunctionV1.0

對于每個匹配的元素所要執(zhí)行的函數(shù)

示例

描述:

迭代兩個圖像，并設(shè)置它們的 src 屬性。注意:此處 this 指代的是 DOM 對象而非 jQuery 對象。

HTML 代碼:

<img/><img/>

jQuery 代碼:

$("img").each(function(i){
   this.src = "test" + i + ".jpg";
 });

結(jié)果:

[ <img src="https://atts.w3cschool.cn/attachments/image/cimg/>, <img src="test1.jpg" /> ]

描述:

如果你想得到 jQuery對象，可以使用 $(this) 函數(shù)。

HTML 代碼:

<button>Change colors</button>
<span></span> 
<div></div> 
<div></div>

<div></div> 
<div></div>
<div id="stop">Stop here</div> 
<div></div>

<div></div>
<div></div>

jQuery 代碼:

$("img").each(function(){
  $(this).toggleClass("example");
});

描述:

你可以使用 'return' 來提前跳出 each() 循環(huán)。

HTML 代碼:

<button>Change colors</button>
<span></span> 
<div></div> 
<div></div>

<div></div> 
<div></div>
<div id="stop">Stop here</div> 
<div></div>

<div></div>
<div></div>

jQuery 代碼:

$("button").click(function () { 
$("div").each(function (index, domEle) { 
  // domEle == this 
  $(domEle).css("backgroundColor", "yellow");  
  if ($(this).is("#stop")) { 
  $("span").text("Stopped at div index #" + index); 
  return false; 
  } 
});
});