关于浏览器渲染VM_ xxx.js的问题

最近有一个站点涉及到改版的问题,由于时间仓促,有很多css和js 都是直接从合适的资源拿过来用的,这就比较容易导致js冲突和css错乱的问题,在一番调试之后,css正常了,去掉许多不合适的元素,发现js的冲突问题比较严重。在修改js的过程中,发现即便处理了不同js之间的冲突,仍然会有程序上的问题,尤其是在有 eval 语句的js中,会在浏览器再度渲染。

先看下正常js的点击效果,可以看到出现 div.#rdaaa 位于index123.js

正常点击js效果

但调试过程中,在这个下面出现了第二次js的渲染,有一个vm1856 _ index123.js ,接着我发现这个vm后面的数字是会变化的,于是我先百度了一波,大家对于这个问题都有点无解,后来检查计算器功能发现每次都累加2,确认程序没有问题,这让我有点抓狂。

浏览器渲染后,出现vm开头的js,实现重复执行js效果

我将鼠标停留在vm这行,做remove操作后发现js功能正常。

对浏览器渲染的vm多remove
计算器累加正常

这个时候我检查年限和账号的加减,发现vm 后面的数字都是不一样的,指向同样的js行,以下是js 43行的内容

程序上正常

这个时候我就思考什么情况下会渲染2次,有没有可能是重复调用,于是我就查了源代码,发现

js重复调用了两次

去掉一个多余的index123.js的引用,程序正常。

小结:

1.遇到vm开头的js并不是所有的都不能解决,先不要慌

2.多多注意报错信息,多用debug断点调试

3.可以通过禁用其他js的方式来排查

4.如果有多次执行的情况,可以优先考虑js冲突或重复引用。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券