vue中引入第三方js文件

wang_dake

于 2020-05-13 10:44:29 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript

本文链接：https://blog.youkuaiyun.com/wang_dake/article/details/106092966

这个博客介绍了如何在Vue项目中使用自定义函数appjs动态引入第三方JS文件。通过创建script元素，设置类型和src属性，并监听onload和onreadystatechange事件来确保脚本加载完成。最后将script元素插入到文档头部。函数支持回调机制，在所有脚本加载完成后执行指定的回调函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

const appjs = (callback,url) => {
var scripts = [url];
var HEAD =
document.getElementsByTagName("head").item(0) ||
document.documentElement;
var s = new Array(),
last = scripts.length - 1,
recursiveLoad = function (i) {
console.log('recursiveLoad中的this',this);
//递归
s[i] = document.createElement("script");
s[i].setAttribute("type", "text/javascript");
s[i].onload = s[i].onreadystatechange = function () {

console.log('onreadystatechange中的this',this);

//Attach handlers for all browsers
if (
!/*@cc_on!@*/ 0 ||
this.readyState == "loaded" ||
this.readyState == "complete"
) {
this.onload = this.onreadystatechange = null;
this.parentNode.removeChild(this);
if (i != last) recursiveLoad(i + 1);
else if (typeof callback == "function") {
callback();
}
}
};
s[i].setAttribute("src", scripts[i]);
HEAD.appendChild(s[i]);
};
recursiveLoad(0);
}

export default appjs