快捷導(dǎo)航

js 索引下標(biāo)之li集合綁定點(diǎn)擊事件

更新時(shí)間：2018年01月12日 14:19:45 作者：joker_xd

本文通過(guò)一段實(shí)例代碼給大家講解了js索引下標(biāo)之li集合綁定點(diǎn)擊事件的相關(guān)知識(shí)，代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧

下面一段代碼給大家介紹li集合綁定點(diǎn)擊事件，具體代碼如下所示：

//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 索引下標(biāo)之li集合綁定點(diǎn)擊事件，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

基于復(fù)選框demo(分享)
下面小編就為大家?guī)?lái)一篇基于復(fù)選框demo(分享)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
JS數(shù)組求和的幾種常見(jiàn)方法總結(jié)
js的數(shù)組與我們?nèi)粘Ｉ钪械臄?shù)組一樣,都是會(huì)進(jìn)行求和計(jì)算的,下面這篇文章主要給大家介紹了關(guān)于JS數(shù)組求和的幾種常見(jiàn)方法,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-01-01
詳解微信小程序input標(biāo)簽正則初體驗(yàn)
這篇文章主要介紹了詳解微信小程序input標(biāo)簽正則初體驗(yàn)，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-08-08
Webpack5正式發(fā)布,有哪些新特性
這篇文章主要介紹了Webpack5正式發(fā)布，有哪些新特性，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2020-10-10
bootstrap3-dialog-master模態(tài)框使用詳解
這篇文章主要為大家詳細(xì)介紹了bootstrap3-dialog-master模態(tài)框的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-08-08
Mozilla中顯示textarea中選擇的文字
Mozilla中顯示textarea中選擇的文字...
2006-09-09
Vue考試系統(tǒng)的后臺(tái)管理功能開(kāi)發(fā)示例解讀
這篇文章主要介紹了Vue考試系統(tǒng)后臺(tái)管理項(xiàng)目的登錄、記住密碼功能具體實(shí)現(xiàn)流程，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2022-09-09
JS實(shí)現(xiàn)的判斷方法、變量是否存在功能示例
這篇文章主要介紹了JS實(shí)現(xiàn)的判斷方法、變量是否存在功能,涉及javascript針對(duì)變量、方法判斷與異常處理操作技巧,需要的朋友可以參考下
2018-05-05
JavaScript中Map與reduce的應(yīng)用小結(jié)
Map構(gòu)造函數(shù)創(chuàng)建一個(gè)新Map對(duì)象,它允許以鍵值對(duì)的形式存儲(chǔ)數(shù)據(jù),提供了一種更加靈活的數(shù)據(jù)結(jié)構(gòu),本文給大家介紹JavaScript中Map與reduce的應(yīng)用小結(jié),感興趣的朋友一起看看吧
2024-06-06
JavaScript原生對(duì)象之String對(duì)象的屬性和方法詳解
這篇文章主要介紹了JavaScript原生對(duì)象之String對(duì)象的屬性和方法詳解,本文講解了length、charAt()、charCodeAt()、concat()、indexOf()、lastIndexOf()等方法屬性,需要的朋友可以參考下
2015-03-03