js中each函數的用法

来源:https://www.cnblogs.com/pengBoRan/archive/2018/04/11/8796494.html
-Advertisement-
Play Games

官方說明: jQuery.each(object, [callback]) 概述 通用例遍方法,可用於例遍對象和數組。 不同於例遍 jQuery 對象的 $().each() 方法,此方法可用於例遍任何對象。回調函數擁有兩個參數:第一個為對象的成員或數組的索引,第二個為對應變數或內容。如果需要退出 ...


官方說明:

jQuery.each(object, [callback]) 

概述 
通用例遍方法,可用於例遍對象和數組。 

不同於例遍 jQuery 對象的 $().each() 方法,此方法可用於例遍任何對象。回調函數擁有兩個參數:第一個為對象的成員或數組的索引,第二個為對應變數或內容。如果需要退出 each 迴圈可使回調函數返回 false,其它返回值將被忽略。 

參數 
objectObject 
需要例遍的對象或數組。 

callback (可選)Function 
每個成員/元素執行的回調函數。

each,一般用來迴圈 數組、對象、Dom元素

1.迴圈數組

  a.一維數組

var arr = [ "one", "two", "three", "four"];     
 $.each(arr, function(){     
    alert(this);     
 });  
//arr為迴圈對象,上面這個each輸出的結果分別為:one,two,three,four    
還可以寫成:
 $.each(arr, function(i,v){     
//  console.log(arr[i]);     // one ,two  ...
//  console.log(this)      //類型為字元串對象
  console.log(v)     //one ,two  ...
    
 });   
b.二維數組
var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]     
$.each(arr1, function(i, item){     
   alert(item[0]);     
}); 

 

item相當於取每一個一維數組,   
item[0]相對於取每一個一維數組裡的第一個值,所以上面這個each輸出分別為:1   4   7     
  
2.迴圈對象
var obj = { one:1, two:2, three:3, four:4};     
$.each(obj, function(i) {     
    alert(obj[i]);           
});   

  迴圈每一個屬性,輸出結果為:1 2 3 4

 3.迴圈Dom

 

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("li").each(function(){
      alert($(this).text())
    });
  });
});
</script>
</head>
<body>
<button>輸出每個列表項的值</button>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Soda</li>
</ul>
</body>
</html>

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 今天其實是改在下午寫代碼了,以後還是儘量固定晚上寫吧,這樣固定任務時間和區間,效率會比較高。 主要是新增了一個說說詳情頁,把每條朋友圈的評論和點贊都放在一個頁面里了。 其實是好像出問題了,明明是有數據的啊…… 為什麼會顯示暫無數據,還是代碼的問題,虧得老師信誓旦旦的說,我就不測試了,這個這麼簡單的邏 ...
  • var arr = ['1','2','3','13','4','2','0','7','6','3','2'];Array.prototype.unique = function() { var temArr = new Array(); for(var i in this) { if(typeo ...
  • html標簽 html的骨架 <html> <head> <title> </title> </head> <body> </body> </html> 圖片的標簽img 1.基本圖片插入方式: <img src="#" /> src:圖片的屬性 2.帶有alt的圖片 <img src="#" al ...
  • function test() { var name = 'alice'; return { getName : function() { console.info(name); }, setName : function(newName) { name = newName; } }};var pe ...
  • var Person = { name : 'alice', say : function(txt1,txt2) { console.info(txt1+txt2); console.info(this.name); }}var Dog = { name : 'tom', say : functio ...
  • 一、工廠模式 工廠模式解決了創建多個相似對象的問題,但沒有解決對象識別的問題(即怎樣知道一個對象的類型)。 二、構造函數模式 主要是利用構造函數創建對象,缺點是當需要定義很多方法是,就要定義很多全局函數,那自定義的引用類型就絲毫沒有封裝性可言了。 三、原型模式 使用原型對象的好處是可以讓所以對象實例 ...
  • 註意:1.預解析相當於函數定義提前,賦值並沒有提前 2.var a = b = c = 9;相當於 var a=9;局部變數 b=9; c=9;b和c是隱式全局變數 ...
  • 這是我的第一個博客 ...
一周排行
    -Advertisement-
    Play Games
  • 示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後,項目結構如下所示: MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread] 特性用於需要與 COM 組件交互的應用程式,尤其是依賴單線程模型(如 Windows Forms 應用程式)的組件。在 STA 模式下,線程擁有自己的消息迴圈,這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • 在WinForm中使用全局異常捕獲處理 在WinForm應用程式中,全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理,可以有效地捕獲並處理未預見的異常,從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • 前言 給大家推薦一款開源的 Winform 控制項庫,可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫,同時也提供了工具類庫、擴展 ...
  • 說明 該文章是屬於OverallAuth2.0系列文章,每周更新一篇該系列文章(從0到1完成系統開發)。 該系統文章,我會儘量說的非常詳細,做到不管新手、老手都能看懂。 說明:OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友,請關註我吧(*^▽^*) ...
  • 一、下載安裝 1.下載git 必須先下載並安裝git,再TortoiseGit下載安裝 git安裝參考教程:https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit,Git客戶端,32/6 ...
  • 前言 在項目開發過程中,理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼,還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程:Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 一:背景 1. 講故事 前段時間有位朋友找到我,說他的窗體程式在客戶這邊出現了卡死,讓我幫忙看下怎麼回事?dump也生成了,既然有dump了那就上 windbg 分析吧。 二:WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死,入口門檻很低,後續往下分析就不一定了,不管怎麼說先用 !clrsta ...
  • 前言 人工智慧時代,人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API,工具不僅易於集成,還具備高效處理能力。 本文將介紹一款如何利用這些API,為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...