JavaScript 閉包應用-點選li輸出索引號
阿新 • • 發佈：2020-10-27
程式碼實現：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <ul class="nav"> <li>000000000</li> <li>111111111</li> <li>222222222</li> <li>333333333</li> </ul> <script> // 閉包應用-點選li輸出當前li的索引號 // 利用閉包的方式得到當前li的索引號 var lis = document.querySelector('.nav').querySelectorAll('li'); for (var i = 0; i < lis.length; i++) { // 利用for迴圈建立了4個立即執行函式 // 立即執行函式也成為小閉包，因為立即執行函式裡面的任何一個函式都可以使用i這變數 (function(i) { lis[i].onclick = function() { console.log(i); } })(i); } </script> </body> </html>
缺點：
立即執行函式裡面的變數i，需要等到點選事件完成後再銷燬，佔用記憶體。