首页 新闻 会员 周边

如何通过 js 禁用 img 标签中的 onload 事件处理函数

0
悬赏园豆：100 [已解决问题] 解决于 2020-02-06 13:30

比如下面的 html img 标签代码：

<img onload="<span>alert</span>('hello')" src="https://www.cnblogs.com/images/logo_small.gif"/>

在不修改 img 标签部分代码的情况下，如何实现在页面加载时通过 js 代码禁用 onload 中 <span>alert</span>('hello') 事件处理函数？

dudu的主页 dudu | 高人七级 | 园豆：30943
提问于：2020-02-06 11:34
< >
分享
最佳答案
0 
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <img id='demo' onload="alert('hello')" src="123.png" >
    <script type="text/javascript">
        var img = document.getElementById("demo");
        img.onload="none";
    </script>
</body>
</html>
收获园豆：100
寻觅beyond | 小虾三级 |园豆：923 | 2020-02-06 12:46

上面的代码修改了img（加了id属性），如果一点都不改img的话，可以使用document.getElementsByTagName来选择该img。

寻觅beyond | 园豆：923 (小虾三级) | 2020-02-06 12:48

@寻觅beyond: 我把问题搞复杂了，原来这么简单就可以解决，但赋值为 none 不太好吧

dudu | 园豆：30943 (高人七级) | 2020-02-06 12:56

@dudu: 那就设置为一个空字符串也可以

寻觅beyond | 园豆：923 (小虾三级) | 2020-02-06 13:09

@寻觅beyond: 最终采用的代码：

Array.from(document.getElementsByTagName("img"))
     .forEach(img => img.onload = null);
dudu | 园豆：30943 (高人七级) | 2020-02-06 13:30

在实际使用中发现当页面中元素比较多时，这个方法是不可行的，还没来得及执行 img.onload = null ，onload 的事件处理函数已经被浏览器执行了。

dudu | 园豆：30943 (高人七级) | 2020-02-06 21:09

@dudu: 应该是js的位置太靠后了，导致在执行js前，img的onload已经执行完毕；如果可以的话，在每个img后面加一行是最好的。

寻觅beyond | 园豆：923 (小虾三级) | 2020-02-06 21:32

@寻觅beyond: 目前看来只有在实现图片懒加载的情况下才能实现这个。

dudu | 园豆：30943 (高人七级) | 2020-02-06 22:07
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。