<!DOCTYPE html><html><head><title>test</title></head><body><ul><li>11111</li><li>22222</li><li>33333</li><li>44444</li><li>55555</li></ul></body><script type="text/javascript">var ul1 = document.getElementsByTagName('ul')[0];var lis = ul1.children;for(var i=0 ; i<lis.length ; i++){ lis[i].onclick = function(){ console.log(i)// lis[i].parentNode.removeChild(lis[i]);// this.parentNode.removeChild(this);}}</script></html>
2 回答
叮当猫咪
TA贡献1776条经验 获得超12个赞
onclick 里不应该直接使用 i ，这是一个变量
当你 for 结束时，i 的值已经是 5 了，所以所有的 onclick 的 i =5
如果要操作文档对象，尽量使用 ID、Class 等有固定特征的方式
操作父级、上、下关联对象，艹使用 this 会方便一些，在操作对象时，this 在此时代表对象本身。
qq_花开花谢_0
TA贡献1835条经验 获得超7个赞
你好，原因很简单，因为js没有块作用域的概念，循环var的i，直到循环结束还在整个作用域之内，而当click事件触发的时候，循环早就结束了，i的值只能是最大值，所以总是得到5。
下面是能实现你功能的正确方法之一：
<html><head> <meta charset='utf-8'> <style> </style> <script> window.onload=function(){ var oButton = document.getElementsByTagName("button"); num=0; for(var i=0;i<oButton.length;i++){ oButton[i].onclick=(function(idx){ return function(){ console.log(idx + 1); oButton[num].style.background="#ccc"; num=idx; this.style.background="#ff0000"; } })(i); } } </script></head><body> <button >点击1</button> <button >点击2</button> <button >点击3</button> <button >点击4</button> <button >点击5</button></body></html> |
添加回答
举报
0/150
提交
取消