如何解决为什么将其用作对addEventListener回调中要附加到的元素的引用无效?
我有一段JavaScript代码,这些代码选择了具有可编辑类的一堆节点,然后循环遍历它们,在每个节点上添加了一个eventListener:
var elements = document.querySelectorAll('.editable');
for (const element of elements) {
element.addEventListener('mouseover',() => {
element.innerHTML += '<i class="far fa-edit"></i>'
})
}
这段代码可以正常工作,并将<i class="far fa-edit"></i>
附加在“鼠标悬停”的元素上。
但是,如果我将evenlistener的回调函数替换为:
() => { this.innerHTML += '<i class="far fa-edit"></i>' }
我发现这很奇怪,就像我在console.log this
或element
上获得相同节点的引用一样!
据我了解,this
是对调用函数的对象的引用。在这种情况下,element
可以同时使用this
或element
……
为什么此代码的两个版本中只有一个起作用?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。