摘要:方法四利用循環(huán)的方法注意全都是的,不是的注意此處有一個兼容性問題,是類數(shù)組,兼容性好的瀏覽器可以直接使用這三個方法,但是兼容性不好的不能直接用為保證穩(wěn)妥,最好轉(zhuǎn)成真正的數(shù)組或者是的原型是中的一個對象被轉(zhuǎn)成了真正的數(shù)組方法五中給的方法
希望可以實現(xiàn)點擊哪個就打印出對應(yīng)的順序
注意此處使用的var i=0, var是可以被重復(fù)定義的,最后執(zhí)行了i++,根據(jù)垃圾回收機制,當點擊事件發(fā)生的時候,i已經(jīng)變成5了,所以不管點擊哪個li,打印的都是5
window.onload=()=>{ const list = document.querySelectorAll("li") for (var i=0; i正確實現(xiàn):{ console.log(i) } } }
方法一:給每個li添加自定義屬性
window.onload=()=>{ const list = document.querySelectorAll("li") for (var i=0; i方法二:自執(zhí)行函數(shù),并利用作用域的關(guān)系,定義函數(shù)把i傳進來,并進行自動調(diào)用
for (var i=0; i方法三:ES6中的let,let應(yīng)用于塊級作用域,塊級作用域以大括號劃分
let不會被垃圾回收機制回收,var為什么會被回收?因為var聲明的變量會被覆蓋,而let不能被覆蓋,就會被存下來。for (let i=0; i{ console.log(i) } } 方法四:利用for循環(huán)的方法:filter、forEach、map(注意全都是ES5的,不是ES6的)
// 注意此處有一個兼容性問題,li是類數(shù)組,兼容性好的瀏覽器可以直接使用這三個方法,但是兼容性不好的不能直接用 // 為保證穩(wěn)妥,最好轉(zhuǎn)成真正的數(shù)組 const newArr = [].slice.call(list) // 或者const newArr = Array.prototype.slice.call(list), []是Array的原型 console.log(list) // NodeList(5)?[li, li, li, li, li] NodeList是dom中的一個對象 console.log(newArr) // ?[li, li, li, li, li] 被轉(zhuǎn)成了真正的數(shù)組 newArr.forEach((value,index)=>{ value.onclick=function(){ console.log(index) } }) newArr.filter((value,index)=>{ value.onclick=function(){ console.log(index) } }) newArr.map((value,index)=>{ value.onclick=function(){ console.log(index) } })方法五:ES6中給Array的from方法
Array.from(list, function(value, index){ value.onclick=function(){ console.log(index) } })
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/106559.html
摘要:前言今天群里面有很多都在問關(guān)于組件之間是如何通信的問題,之前自己寫的時候也遇到過這類問題。英文能力有限,如果有不對的地方請跟我留言,一定修改原著序處理組件之間的交流方式,主要取決于組件之間的關(guān)系,然而這些關(guān)系的約定人就是你。 前言 今天群里面有很多都在問關(guān)于 React 組件之間是如何通信的問題,之前自己寫的時候也遇到過這類問題。下面是我看到的一篇不錯英文版的翻譯,看過我博客的人都知道...
摘要:,至此咱們的微信小程序的簡單使用及了解算是分享完了,畢竟個人也是道行有限,沒有鉆研太深,這些只是本人在實際項目開發(fā)過程中用到和總結(jié)的經(jīng)驗,有太多不足或不對的地方,希望大家多多給予指出與改正,咱們一起來共同學(xué)習(xí)與進步 微信小程序是一種不需要下載安裝即可使用的應(yīng)用,在國內(nèi)它在企業(yè)推廣中的受歡迎度以及就這兩年的使用及普及熱度,然而就是因為它的備受歡迎度以及越來越被企業(yè)所重視,也就形成了咱們開...
摘要:,至此咱們的微信小程序的簡單使用及了解算是分享完了,畢竟個人也是道行有限,沒有鉆研太深,這些只是本人在實際項目開發(fā)過程中用到和總結(jié)的經(jīng)驗,有太多不足或不對的地方,希望大家多多給予指出與改正,咱們一起來共同學(xué)習(xí)與進步 微信小程序是一種不需要下載安裝即可使用的應(yīng)用,在國內(nèi)它在企業(yè)推廣中的受歡迎度以及就這兩年的使用及普及熱度,然而就是因為它的備受歡迎度以及越來越被企業(yè)所重視,也就形成了咱們開...
摘要:,至此咱們的微信小程序的簡單使用及了解算是分享完了,畢竟個人也是道行有限,沒有鉆研太深,這些只是本人在實際項目開發(fā)過程中用到和總結(jié)的經(jīng)驗,有太多不足或不對的地方,希望大家多多給予指出與改正,咱們一起來共同學(xué)習(xí)與進步 微信小程序是一種不需要下載安裝即可使用的應(yīng)用,在國內(nèi)它在企業(yè)推廣中的受歡迎度以及就這兩年的使用及普及熱度,然而就是因為它的備受歡迎度以及越來越被企業(yè)所重視,也就形成了咱們開...
閱讀 3491·2023-04-25 18:52
閱讀 2504·2021-11-22 15:31
閱讀 1264·2021-10-22 09:54
閱讀 3037·2021-09-29 09:42
閱讀 626·2021-09-26 09:55
閱讀 934·2021-09-13 10:28
閱讀 1131·2019-08-30 15:56
閱讀 2123·2019-08-30 15:55