1、
<ul> <li>a</li> <li>a</li> <li>a</li> <li>a</li> </ul>
使用原生JS ,addEventListener,给每个li绑定一个click事件,输出他们的顺序
<ul> <li>a</li> <li>a</li> <li>a</li> <li>a</li> </ul> <script type="text/javascript"> var liCol = document.getElementsByTagName('li'), len = liCol.length; for(var i = 0; i < len; i++){ //错误写法,形成了闭包 // liCol[i].addEventListener('click',function(){ // console.log(i); // },false); // 使用立即执行函数 (function(i){ liCol[i].addEventListener('click',function(){ console.log(i); },false); }(i)) } <script>2、封装兼容性的addEvent(elem,type,handle);方法
<script type="text/javascript"> function addEvent(elem,type,handle){ if(elem.addEventListener){ elem.addEventListener(type,handle,false); }else if(elem.attachEvent){ elem.attachEvent('on' + type,function(){ handle.call(elem); }) }else{ elem['on' + type] = handle; } } </script>