詳解jQuery-each()方法
更新時間：2019年03月13日 16:15:53 作者：笑蒼茫
這篇文章主要介紹了jQuery-each()方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
jquery中有隱式迭代，不需要我們再次對某些元素進行操作。但是如果涉及到不同元素有不同操作，需要進行each遍歷。本文利用10個li設置不同的透明度的案例，對each方法進行說明。
語法：
$(元素).each(function(index,element){ });
參數(shù)index：表示元素索引，在本例中是0-9
參數(shù)element：表示對象，在本例中是每個li
案例效果：
代碼如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
li{
width: 100px;
height: 100px;
background-color: green;
list-style: none;
float: left;
margin-left: 10px;
}
</style>
<script src="jquery-1.12.2.js"></script>
<script type="text/javascript">
$(function(){
//頁面加載后,讓每個li的透明度發(fā)生改變
$("li").each(function(index,element){
//第一個參數(shù)是索引,第二個參數(shù)是對象
$(element).css("opacity",(index+1)/10);
})
});
</script>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
</ul>
</body>
</html>
以上所述是小編給大家介紹的jQuery-each()方法詳解整合，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
您可能感興趣的文章:
- jQuery實現(xiàn)動態(tài)添加和刪除input框代碼實例
- jQuery ajax仿Google自動提示SearchSuggess功能示例
- JQueryDOM之樣式操作
- 淺談JS和jQuery的區(qū)別
- jQuery實現(xiàn)動態(tài)添加和刪除input框實例代碼
- jQuery添加新內容的四個常用方法分析【append，prepend，after，before】
- 簡單易擴展可控性強的Jquery轉盤抽獎程序
- 使用jquery的cookie實現(xiàn)登錄頁記住用戶名和密碼的方法
- Jquery的autocomplete插件用法及參數(shù)講解
- jQuery事件blur()方法的使用實例講解
相關文章
jquery tablesorter.js 支持中文表格排序改進
之前研究過一下表格排序。上網(wǎng)找了一些代碼研究了一下。勉強做了一個用著。后面發(fā)現(xiàn)當動態(tài)給單元格加超鏈接，或者列中存在一些空白，就排序不了了。2009-12-12
本文主要分享了jQuery實現(xiàn)鼠標跟隨效果的示例代碼。具有很好的參考價值，下面跟著小編一起來看下吧2017-02-02
用Jquery去操作HTML元素很方便，能夠靈活自如的去查找。其實CSS也可以靈活方便的去查找篩選，以下用到的一些，整理了一下，還有很多有趣的用法，后續(xù)會繼續(xù)添加。2011-07-07
本文只是一個簡單的演示程序，大家可以根據(jù)自己的需求進行修改，以達到自己想要實現(xiàn)的功能。2016-03-03
這篇文章主要介紹了jQuery獲取頁面及個元素高度、寬度的總結——超實用,需要的朋友可以參考下2015-07-07
通過jquery和css相結合的方式實現(xiàn)鼠標點擊圖片彈出畫廊切換特效，效果逼真，下面小編把源碼分享給大家供大家參考2015-11-11
這篇文章介紹了基于jQuery實現(xiàn)的一個簡單大方的垂直導航菜單，過度平滑,需要的朋友可以參考下2015-08-08
眾所周知，jQuery現(xiàn)在已經(jīng)非常流行，百度新首頁中也已經(jīng)開始使用jQuery，今天總結下怎么書寫更好的jQuery代碼使jQuery代碼更好、更快的執(zhí)行，希望本篇jQuery教程一改大家以前不合理的做法2014-06-06
這篇文章主要介紹了8個超實用的jQuery技巧攻略,如禁用右鍵、返回頂部、圖片預加載等,需要的朋友可以參考下2014-03-03
這篇文章主要為大家詳細介紹了jquery實現(xiàn)購物車基本功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10