js 索引下標之li集合綁定點擊事件
更新時間：2018年01月12日 14:19:45 作者：joker_xd
本文通過一段實例代碼給大家講解了js索引下標之li集合綁定點擊事件的相關(guān)知識，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的朋友參考下吧
下面一段代碼給大家介紹li集合綁定點擊事件，具體代碼如下所示：
//Method-1:
var items = document.getElementsByTagName('li');
for(var i=0;i<items.length;i++){
items[i].index = i;
items[i].onclick = function(){
this.innerHTML = this.index;
}
}
//Method-2:
var items = document.getElementsByTagName('li');
for(var i = 0; i<items.length; i++){
(function(index){
items[i].onclick = function(){
this.innerHTML = index;
}
})(i)
}
//Method-3:
var items = document.getElementsByTagName('li');
for(var i = 0; i<items.length; i++){
items[i].onclick = function(index){
return function(){
this.innerHTML = index;
}
}(i)
}
總結(jié)
以上所述是小編給大家介紹的js 索引下標之li集合綁定點擊事件，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
您可能感興趣的文章:
- JS遍歷ul下的li點擊彈出li的索引的實現(xiàn)方法
- JS數(shù)組操作(數(shù)組增加、刪除、翻轉(zhuǎn)、轉(zhuǎn)字符串、取索引、截取(切片)slice、剪接splice、數(shù)組合并)
- 用javascript為DropDownList控件下拉式選擇添加一個Item至定義索引位置
- JavaScript遍歷DOM元素的常見方式示例
- JavaScript實現(xiàn)的DOM樹遍歷方法詳解【二叉DOM樹、多叉DOM樹】
- JS遍歷DOM文檔樹的方法實例詳解
- javascript先序遍歷DOM樹的方法
- JavaScript簡單遍歷DOM對象所有屬性的實現(xiàn)方法
- JS實現(xiàn)點擊li標簽彈出對應的索引功能【案例】
相關(guān)文章
下面小編就為大家?guī)硪黄趶瓦x框demo(分享)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
js的數(shù)組與我們?nèi)粘Ｉ钪械臄?shù)組一樣,都是會進行求和計算的,下面這篇文章主要給大家介紹了關(guān)于JS數(shù)組求和的幾種常見方法,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2023-01-01
這篇文章主要介紹了詳解微信小程序input標簽正則初體驗，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了Webpack5正式發(fā)布，有哪些新特性，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-10-10
bootstrap3-dialog-master模態(tài)框使用詳解
這篇文章主要為大家詳細介紹了bootstrap3-dialog-master模態(tài)框的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
Mozilla中顯示textarea中選擇的文字...2006-09-09
Vue考試系統(tǒng)的后臺管理功能開發(fā)示例解讀
這篇文章主要介紹了Vue考試系統(tǒng)后臺管理項目的登錄、記住密碼功能具體實現(xiàn)流程，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-09-09
這篇文章主要介紹了JS實現(xiàn)的判斷方法、變量是否存在功能,涉及javascript針對變量、方法判斷與異常處理操作技巧,需要的朋友可以參考下2018-05-05
JavaScript中Map與reduce的應用小結(jié)
Map構(gòu)造函數(shù)創(chuàng)建一個新Map對象,它允許以鍵值對的形式存儲數(shù)據(jù),提供了一種更加靈活的數(shù)據(jù)結(jié)構(gòu),本文給大家介紹JavaScript中Map與reduce的應用小結(jié),感興趣的朋友一起看看吧2024-06-06
JavaScript原生對象之String對象的屬性和方法詳解
這篇文章主要介紹了JavaScript原生對象之String對象的屬性和方法詳解,本文講解了length、charAt()、charCodeAt()、concat()、indexOf()、lastIndexOf()等方法屬性,需要的朋友可以參考下2015-03-03