如何删除动态的js?

比如我动态的创建了script标签,从textarea获取动态写入的内容

var num = 1;
setInterval(()=>{
++num;
console.log(num);
$('.box').html(num);
},1000)

然后添加到body里面去。

当再次修改textarea里面的内容的时候,删除之前的创建的script,再重新生成,然后就发现,之前写的js还在执行。有没有什么办法可以清除之前的js,各位大神指教一下,谢谢!

阅读 4.6k
5 个回答

无法清除

比如说你全局有个 window.a = 1
在你 textarea 的 script 中执行 (window.a++)
那么你想在想让 window.a == 1 , 这是不可能的

当然既然是程序就不存在绝对的不可能,那么有什么可以实现的方案呢?

  1. script 构建到新的 iframe 中,每次其实都是重新加载页面。比如说一些在线编辑器, jsrun 、codepen 不都是这样的吗?
  2. 不使用全局的变量,而是使用固定的变量,比如说vue,每次手动销毁即可。

JavaScript 是事件驱动的,JavaScript 运行的本质,其实就是将组织好的逻辑绑定到事件,在事件触发的时候按照组织好的逻辑行事,当绑定事件这个动作完成之后,文档里的代码就没用了,这个时候,删除代码也不会影响已经绑定的逻辑
这里的事件是广义的,除了 BOMDOM 事件之外,脚本加载完成、定时器到了指定的时长……都算事件。
所以你要终止那些被删除代码的逻辑的运行,其实是要解除它们与事件的绑定:添加到 DOM 事件的,要移除监听;放到定/延时器里的回调,就清除定/延时器;处理 Ajax 请求的,就 abort请求……
为了确保解绑成功,你必须缓存解绑的入口:对于 HTML 元素而言,要保留 DOM 引用或者确保选择器还能选到元素;对于定/延时器,你要缓存初始化时返回的那个 ID;对于 Ajax 请求而言,你要缓存 XMLHTTPRequest 实例或者 Promise 对象。
像你这个定时器解除的最佳方法,就是按照楼上说的来,用 timer 缓存定时器 ID,不要的时候再清除它就可以了。

新手上路,请多包涵

timer = setInterval(....)

要清除时
clearInterval(timer)

新手上路,请多包涵

如果是DOM监听就是 removeEventListener移除监听。
如果是函数是全局函数 你可以使用同名的函数 重新定义一遍。就覆盖原来的定义了,也相当于清除了原来的功能

对, 可以尝试用函数封装这段逻辑,再次加载的时候覆盖它

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题