JavaScript事件注册：方法一正常，方法二报错“Cannot set property ‘onmouseover’ of undefined”
本文分析一个常见的JavaScript事件注册问题：两种看似相同的注册方式，一种运行正常，另一种却报错“Cannot set property ‘onmouseover’ of undefined”。问题出现在使用querySelectorAll选择元素后，分别为li元素及其对应的隐藏下拉列表元素注册onmouseover和onmouseout事件。目标是：鼠标悬停在li元素上显示下拉列表，移开鼠标则隐藏下拉列表。
代码使用了两种方法：方法一分别为每个元素注册事件；方法二使用循环批量注册。方法一正常运行，而方法二报错。
错误原因在于方法二中潜在的数组越界问题。querySelectorAll返回NodeList，方法二直接使用sideBarLi.length作为循环条件，未检查对应隐藏下拉列表元素数量是否一致。如果隐藏下拉列表元素数量少于li元素数量，循环访问时就会出现itemHidden[i]为undefined的情况，导致报错。方法一避免了此问题，因为它是分别注册事件，而非循环遍历。
大师兄智慧家政
58到家打造的AI智能营销工具
99 查看详情
立即学习“Java免费学习笔记（深入）”；
核心问题是querySelectorAll返回的NodeList长度可能不一致。如果#sideBar下的li元素数量多于.item_hide元素，方法二循环中i超过.item_hide元素数量时，itemHidden[i]将为undefined，引发错误。
解决方法：在方法二中添加长度判断，确保i始终在itemHidden的有效索引范围内；或者，确保sideBarLi和itemHidden的NodeList长度始终相等。 这需要仔细检查HTML结构，确保li元素和对应的隐藏下拉列表元素之间存在一一对应的关系。
以上就是JavaScript事件注册：为什么方法一正常运行，方法二却报错提示“Cannot set property ‘onmouseover’ of undefined”？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1130870.html
微信扫一扫 
支付宝扫一扫 
