异步加载layui的模块在IE11下不兼容问题

本文介绍了在IE11浏览器中,异步加载layui模块遇到的不兼容问题,表现为‘不是有效的模块’错误。分析了在IE11下script对象的属性差异,并提供了两种解决方案:在layui配置中设置dir属性,以及修改layui源码以适配IE11的script.onload事件。

异步加载layui的模块在IE11下不兼容问题

  1. 异步加载layui的模块在IE11下报错:不是有效的模块。 1

  2. 通过断点查看layuiuse方法发现IE8ChromegetPath都是layui.js所在的目录,而IE11下为空字符串。 2

  3. getPath的值为: 3

  4. doc.currentScript.src是当前执行的js的路径,所以Chrome能正常获取到layui.js所在的目录,而IE中没有doc.currentScript这个属性,所以会进入后面的方法中。 4

  5. script.readyState是判断脚本的加载状态的,interactive表示还未执行完成,所以IE8下也能正常获取到layui.js的所在的目录,而IE11script.readyState已经被删除了,所以IE11getPath为空字符串。 5

  6. 但是不用异步加载,直接通过<script>标签引入layui却又没问题,原因是:在script.readyState === interactive都不成立时src的值为空,则取js[last].src,即此时<script>最后一个的src,也就是layui.js所在的目录,而异步加载的情况最后一个不一定会是layui.js,所以IE11getPath为空字符串。 6

解决方法

  1. 在config中设置dir: 7
    在layui的官方文档中也有layui底层方法

  2. 修改源码 8IE11将script.readyState删除,但有script.onload,script.onload官方文档可以考虑从这下手。(这是一条思路,但因为第三方插件不由我提供,所以我也没实现,我用的是第一种方式)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值