关于原生js里报这个错:Cannot read properties of undefined (reading ‘classList‘) at HTMLLIElement.

这篇具有很好参考价值的文章主要介绍了关于原生js里报这个错:Cannot read properties of undefined (reading ‘classList‘) at HTMLLIElement.。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

cannot read properties of undefined (reading 'classlist'),一些小问题,javascript,前端 

说是不能读取classList这个属性,我写的代码是这样的

      let lis = document.querySelectorAll(".tab .tab-item");
      let divs = document.querySelectorAll(".products .main");
      for (let i = 0; i < lis.length; i++) {
        lis[i].addEventListener("click", function () {
          document.querySelector(".tab .active").classList.remove("active");
          this.classList.add("active");
          console.log(this);

          document.querySelector(".products .active").classList.remove("active");
          divs[i].classList.add("active");
        });
      }

写到divs[i]这里一直报错,我打印是undefined,我就一直想不通

直到我看见了for循环里面的i,for循环里面的i如果不声明默认是全局变量,如果不加let就会出问题

至于为什么,我搜了一下,说是

用 var 声明时,变量 i 是唯一的,每一次 i 的改变都改变了自身的栈地址。
所以循环结束后访问 i 时,都通过 i 最后一次存放的栈地址,获取到其指向的基本量。

虽然我也没太看懂,但是

 一定要记得写let!!!!!文章来源地址https://www.toymoban.com/news/detail-635416.html

到了这里,关于关于原生js里报这个错:Cannot read properties of undefined (reading ‘classList‘) at HTMLLIElement.的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in nextTick: “TypeError: Cannot read properties of und

    vue使用vue-element-admin报错: 原因是: 其中 ayout=\\\"prev, pager, next\\\" 的pager拼写错了

    2024年02月16日
    浏览(85)
  • 【解决】el-tree报Cannot read property ‘getCheckedKeys‘ of undefined Cannot read property 'getCheckedKeys' of undefined

    如果你报错 或者  只要在你的在el-tree上加个这个,就可以了   ref=\\\"tree\\\"  

    2024年02月14日
    浏览(84)
  • Cannot read properties of undefined (reading ‘key‘)

    如标题所示错误,直译是key为undefined。本次是因为使用了element-ui中的el-table组件所以并不是key为undefined,而是后台返回的key有重复。 当key重复就会出现页面卡死的现象,渲染就会失败。 key在使用时我们要注意: 1.在渲染时该识别为不同时,识别为相同 2.在渲染时该识别为相

    2024年02月03日
    浏览(38)
  • Cannot read properties of undefined (reading ‘validate‘)“

         不排除this.$refs[value].validate()=(),有时候不会报错 template div el-form ref=\\\"value\\\" :model=\\\"getAppForm\\\" label-width=\\\"120px\\\" style=\\\"text-align:left\\\" :rules=\\\"rules\\\" /el-form1 /div /template script data(){}, methids:{  makeSure() {             this.$refs.value.validate((valid)={                 if(valid){             })  

    2024年02月02日
    浏览(50)
  • Cannot read properties of undefined (reading ‘sendTransaction‘)

    这个是因为没有引入 和初始化  web3 对象。 原来的代码: 现在初始化 web3 然后执行,后发现 Web3 is not defined 错误, 现在只要引入 web3.js 文件即可。

    2024年02月04日
    浏览(57)
  • 解决Cannot read properties of undefined (reading ‘resetFields‘)

    第一天做项目中遇到了这一个问题关于resetField重置校验报错的问题,   然后去网上查找问题的原因,但是找到问题的原因是: mouted加载table数据以后,隐藏的 Dialog 并没有编译渲染进 dom 里面。所以当通过点击事件,Dialog 弹出的时候,$refs 并没有获取到 dom 元素导致 ‘reset

    2023年04月23日
    浏览(82)
  • 解决 Cannot read properties of null (reading ‘disabled‘)报错

    在Vue + elementUI 后台项目里遇到了一个问题,所有模块的的下拉Select 和时间选择器DataPicker (可能还有其他组件) ,在选择后点击页面其他地方都不会自己收起。打开控制台会发现报错了,每点击一次,错误+1. 代码里全局搜索 el-dropdown ,el-dropdown下缺少 el-dropdown-menu 元素,如果

    2024年02月13日
    浏览(43)
  • TypeError: Cannot read properties of undefined (reading ‘replace‘)

    错误一:TypeError: Cannot read properties of undefined (reading \\\'replace\\\') 错误二:[Vue warn]: inject() can only be used inside setup() or functional conponents. 解释:当我们使用内置 use开头的钩子函数时,不能进行嵌套去拿实例。如: 解决:必须在 setup函数 第一层调用。

    2024年02月11日
    浏览(46)
  • “TypeError: Cannot read properties of null (reading ‘getContext‘)“

    目录 一、报错截图 二、使用场景 三、代码截图 四、报错原因  五、解决办法 第一次在vue项目种使用canvas,跟着网上教程做,标签canvas写好了,dom元素获取了,简单“画”了一下,运行之后报\\\"TypeError: Cannot read properties of null (reading \\\'getContext\\\')\\\"的错。 意思是:找不到getContex

    2024年02月16日
    浏览(46)
  • ❤ cannot read properties of null(reading appendChild)解决办法

    写的一个js渲染,但是出了个小问题,cannot read properties of null(reading appendChild)报错。 大致意思是:不能读取空的属性。 1、console.log() //打印数据内容,查看获取数据是否有问题。 2、js引入放body最后面,页面是自上而下的运行的,HTML都没有运行到,当然获取不到对应节点 3、

    2024年02月14日
    浏览(43)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包