为什么mouseonhover javascript无法与类一起使用,但可以在id上使用?

詹戈格

为什么鼠标悬停在javascript中不能与类一起使用,但可以在id上使用?

例如,

 window.onload = function() {
    var myIcon = document.getElementsByClassName('myIcon'); //does not work
    myIcon.onmouseover = function() {
        // do something
        return false;
    };
};   

but

window.onload = function() {

    var myIcon = document.getElementsByID('myIcon'); //works 

    myIcon.onmouseover = function() {
        // do something
        return false;
    };
};   
李安德

您有两个同名的变量,即重新声明和重新分配myIcon另外,getElementsByID不是函数,getElementById或者getElementsById是。getElementsById然后返回带有元素“数组”的NodeList。最后,getElementsByClassName还返回一个NodeList。两者都是类似数组的,因此您必须像对待数组一样对待它。

这是JSFiddle上的一个示例,请注意,getElementsByClassName该示例仅适用于class的第一个元素myIcon您可以使用for循环遍历所有元素并更改其侦听器。

var myIcon_class = document.getElementsByClassName('myIcon')[0]; //note, gets first element
var myIcon = document.getElementById('myIcon')
    
myIcon.onmouseover = function() {
    alert("hovered on ID!");
    return false;
};
    
myIcon_class.onmouseover = function() {
	alert("hovered on class!");
    return false;
}; 
<span id="myIcon">Id span!</span>
<span class="myIcon">Class span!</span>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

为什么函数模板不能理解NULL但可以与nullptr一起使用?

来自分类Dev

为什么在使用-P时Docker不能正确公开我的端口,但可以与-p 80:80一起使用?

来自分类Dev

为什么不使用Android 4.3无法播放资产,但可以在2.3和4.2上正常播放

来自分类Dev

为什么我的导航栏无法在Google Chrome浏览器中正常显示,但可以在其他浏览器上使用

来自分类Dev

为什么点运算符(。)可以与私有类成员/方法一起使用?

来自分类Dev

为什么茉莉花无法比较knockout.js的可观察对象,但可以正常使用功能?

来自分类Dev

为什么我无法加载早上生成的 excel 文件,但可以使用 Openpyxl 在 Python 中加载它们

来自分类Dev

Javascript 数组无法在循环内填充,但可以正常工作。为什么?

来自分类Dev

为什么Quickbooks可以与Ubuntu一起使用,而不能与Fedora一起使用?

来自分类Dev

为什么它可以与$ scope一起使用,但不能与`this`一起使用?

来自分类Javascript

为什么.includes()无法与.classList一起使用?

来自分类Dev

为什么URI路径无法与File一起使用?

来自分类Javascript

为什么React Router无法与<Switch>一起使用?

来自分类Dev

为什么$ .ajaxSetup无法与$ .post一起使用

来自分类Dev

为什么React Router无法与Redux一起使用?

来自分类Dev

为什么C ++ Map的operator <无法与<=一起使用

来自分类Dev

为什么grep无法与重定向一起使用?

来自分类Dev

为什么@Transactional无法与@Autowired EntityManagerFactory一起使用?

来自分类Dev

为什么AdaBoost无法与DecisionTree一起使用?

来自分类Dev

为什么setTimeout无法与.hover()一起使用?

来自分类Dev

为什么FORMAT无法与expandproperty一起使用

来自分类Dev

为什么mkdir无法与GString一起使用?

来自分类Dev

为什么Pinterest API无法与$ .getJSON一起使用

来自分类Dev

为什么PanResponder无法与useEffect Hook一起使用?

来自分类Dev

为什么mkdir无法与通配符一起使用?

来自分类Dev

为什么eval()无法与数组一起使用

来自分类Dev

为什么live()无法与jQuery一起使用?

来自分类Dev

`entr`:如何更新ID?noatime麻烦?&,为什么-r无法与-d一起使用?

来自分类Dev

为什么我不能使用 pip 安装 cudatookkit=10.1 但可以使用 conda?

Related 相关文章

  1. 1

    为什么函数模板不能理解NULL但可以与nullptr一起使用?

  2. 2

    为什么在使用-P时Docker不能正确公开我的端口,但可以与-p 80:80一起使用?

  3. 3

    为什么不使用Android 4.3无法播放资产,但可以在2.3和4.2上正常播放

  4. 4

    为什么我的导航栏无法在Google Chrome浏览器中正常显示,但可以在其他浏览器上使用

  5. 5

    为什么点运算符(。)可以与私有类成员/方法一起使用?

  6. 6

    为什么茉莉花无法比较knockout.js的可观察对象,但可以正常使用功能?

  7. 7

    为什么我无法加载早上生成的 excel 文件,但可以使用 Openpyxl 在 Python 中加载它们

  8. 8

    Javascript 数组无法在循环内填充,但可以正常工作。为什么?

  9. 9

    为什么Quickbooks可以与Ubuntu一起使用,而不能与Fedora一起使用?

  10. 10

    为什么它可以与$ scope一起使用,但不能与`this`一起使用?

  11. 11

    为什么.includes()无法与.classList一起使用?

  12. 12

    为什么URI路径无法与File一起使用?

  13. 13

    为什么React Router无法与<Switch>一起使用?

  14. 14

    为什么$ .ajaxSetup无法与$ .post一起使用

  15. 15

    为什么React Router无法与Redux一起使用?

  16. 16

    为什么C ++ Map的operator <无法与<=一起使用

  17. 17

    为什么grep无法与重定向一起使用?

  18. 18

    为什么@Transactional无法与@Autowired EntityManagerFactory一起使用?

  19. 19

    为什么AdaBoost无法与DecisionTree一起使用?

  20. 20

    为什么setTimeout无法与.hover()一起使用?

  21. 21

    为什么FORMAT无法与expandproperty一起使用

  22. 22

    为什么mkdir无法与GString一起使用?

  23. 23

    为什么Pinterest API无法与$ .getJSON一起使用

  24. 24

    为什么PanResponder无法与useEffect Hook一起使用?

  25. 25

    为什么mkdir无法与通配符一起使用?

  26. 26

    为什么eval()无法与数组一起使用

  27. 27

    为什么live()无法与jQuery一起使用?

  28. 28

    `entr`:如何更新ID?noatime麻烦?&,为什么-r无法与-d一起使用?

  29. 29

    为什么我不能使用 pip 安装 cudatookkit=10.1 但可以使用 conda?

热门标签

归档