js清除onclick、onresize等事件监听方法

已于 2024-02-01 16:06:34 修改
阅读量531 收藏 10
点赞数 8
文章标签： javascript
于 2024-02-01 16:05:15 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_65448891/article/details/135976333
版权

首先，为什么要清？

因为如果很多同时没被清除，那么就会消耗大量内存，导致性能下降

怎么清？

最简单的方法：
window.onresize = null

为什么可以这样清？

因为当一个变量解除了引用，那么它的值就不在这个上下文中，下一次的垃圾回收就会将这个变量回收掉。

_大个仔
关注
  • 8
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
JavaScript移除事件的方法
猿码互联
06-01 394
这两种方法都可以用于移除事件，但建议使用removeEventListener方法，因为它提供了更精确的控制，并且可以移除通过addEventListener方法添加的任何事件处理函数。而onclick=null方法只能移除通过DOM属性添加的事件处理函数。它需要传入三个参数：事件类型、事件处理函数和一个可选的布尔值来指定事件是否在捕获阶段触发。在DOM中，可以将一个事件处理函数直接设置为null来移除事件。这种方法只适用于内联事件处理函数或通过DOM属性添加的事件处理函数。
js取消 删除点击事件
h0713的博客
06-28 6309
用js赋予点击事件 var redone=document.getElementById("gd2_3"); redone.addEventListener('click',canbeclick,true); function canbeclick(){ alert("啊，好爽啊!"); } 用js取消/删除点击事件 redone.removeEventListener('click',canbeclick,true); 上面代码亲测有效。 因为看到网上有将redone.οnclick=
移除 JavaScript 中事件监听器的几种方法
最新发布
VvpApplescript的博客
09-17 8999
在上面的代码中，我们首先定义了一个事件监听器 handleClick()，然后使用 addEventListener() 将它添加到 id 为 “myButton” 的按钮上。需要注意的是，如果我们直接在 removeEventListener() 中使用匿名函数，那么事件监听器将无法被正确移除。在上面的代码中，我们将事件监听器添加到父元素上，并在事件处理函数中检查事件目标是否是我们感兴趣的子元素。如果是，我们执行相应的操作。在这种情况下，移除事件监听器的方法稍有不同，我们需要在移除时使用相同的匿名函数。
js 上传之后去除onclick 事件 判断上传格式
typ199758595的博客
09-29 367
js 上传之后去除onclick 事件 判断上传格式
js onclick 移除_高手进阶之史上最全JS内存管理策略剖析
weixin_35817602的博客
01-22 250
前言本文主要和大家探讨下JS中核心的板块-内存管理的相关知识点，同时给出了大量的内存管理实例并做了深入的剖析，希望对同处前端的你带来收获。当然，欢迎大家关注我，我将持续分享哪些前端层面核心的知识点，希望能给同处前端的你带来一点点收获。1、JavaScript的内存管理1.1、 栈内存与堆内存JavaScript中的变量分为基本类型和引用类型。基本类型就是保存在栈内存中的简单数据段，而引用类型指的是...
JS实现按钮清除单击事件,或单击事件执行一次
weixin_34319374的博客
12-22 1715
2019独角兽企业重金招聘Python工程师标准>>> ...
js动态添加onload、onresize、onscroll事件(另类方法)
01-19
window 的 onload、onresize、onscroll 事件，跟其他的事件不一样，它不能用 attachEvent 或 addEventListener 来添加。也就是说，它只能这样来（以 onload 为例，下同）： 代码如下: [removed] = function() { // ...
浅谈javascript属性onresize
10-24
主要介绍了浅谈javascript属性onresize的详细使用方法，十分的实用，这里推荐给大家，有需要的小伙伴可以参考下。
HTML5事件方法全部汇总
09-28
HTML5事件方法是网页开发中...在实际开发中，通过结合JavaScript和HTML5事件方法，可以实现各种功能，如表单验证、动态效果、媒体控制等。理解并熟练运用这些事件方法对于构建高性能、用户体验优秀的Web应用至关重要。
深入理解JS的事件绑定、事件流模型
10-18
- 脚本模型（动态绑定）：在JavaScript中通过选择器找到元素并添加事件监听器，如`document.getElementById("btn1").onclick = function() {}`。这种方式更符合W3C标准，但一个元素只能有一个同类型的事件处理函数...
js的onclick事件
rui276933335的专栏
04-21 902
JSP页面循环 ${mp.com_name} 贷款类型${mp.loan_type}${mp.make_loan_time}放贷 费用详情月费率：${mp.month_interest}%一次性费用：${mp.nonrecurring_expense}% 无职业要求申请 js中 function shenqin
js 监听事件的叠加和移除
setsunadoudou的博客
10-06 428
　　html DOM元素有很多on开头的监听事件，如onload、onclick等，见DOM事件列表。但是同一种事件，后面注册的会覆盖前面的： window.onresize = function()...
vue 里 onresize 事件被覆盖，以及怎么实现 resize 防抖、移除 resize 事件？
学习前端这门手艺，栈底到栈顶依次是：浏览器架构、Web 网络、事件循环机制、JavaScript 核心、V8 的内存管理、浏览器的渲染流程、Web 安全、CSS、React、Vue、Node、构建工具链等
12-13 2296
onresize 事件被覆盖 采用 window.addEventListener('resize', func) 监听实现 移除 resize 事件 destroyed() { window.removeEventListener('resize', this.func); }, 实现 resize 防抖 安装 npm i throttle-debounce 库，实现如下 // 节流-防抖 import { debounce } from 'throttle-debounce'; export de
window.onresize绑定事件以及解绑事件
diaoshu2256的博客
07-18 2372
问题描述 在Vue工程中，添加样式，部分需要做到自适应，需要添加resize事件，由于是单页面应用，如果组件初始化的时候绑定事件，在切换页面的时候不去注销事件，如果来回切换，会让resize事件执行多个函数，迅速消耗CPU,浏览器会出现卡顿的情况 解决办法 Vue生命周期mounted 添加 resize事件 Vue生命周期destroy 删除 resize事件 案例 ...
window.onresize在vue中只能使用一次,自适应resize报错
weixin_45837076的博客
12-13 1087
window.onresize在vue中只能使用一次,自适应resize报错
js 添加和移除onclick事件（通过匿名函数实现）及jquery 移除事件
weixin_33694172的博客
01-25 6599
2019独角兽企业重金招聘Python工程师标准>>> ...
js两种移除事件的方法
Smallwhitestrive的博客
10-08 8010
在js的学习中，为元素添加事件是非常常见的 那么，下面我带大家了解一下js中移除事件的两种方法 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="button" value="点我啊" id="fst" /> <input type
vue3使用onresize方法监听页面宽度
04-01
在Vue3中使用onresize方法来监听页面宽度，可以通过以下步骤实现： 1. 在组件的mounted()生命周期中，使用window.addEventListener()方法监听resize事件。 2. 在resize事件的回调函数中，使用window.innerWidth获取当前窗口的宽度，并将其保存在data中。 3. 在组件的template中使用{{}}插值表达式来显示保存的宽度值。 以下是示例代码： ``` <template> <div> 当前窗口宽度：{{ windowWidth }} </div> </template> <script> export default { data() { return { windowWidth: window.innerWidth } }, mounted() { window.addEventListener('resize', this.handleResize) }, methods: { handleResize() { this.windowWidth = window.innerWidth } } } </script> ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值