js实现动态创建script并插入页面html的head区域

js在前端开发中是必不可少的重要组成部分,基于js实现的各类效果也是数不胜数。前端开发中关于js的应用更是千变万化,那么开发中我们可以如何使用js呢?

根据需求使用js在开发中一直被提倡甚至应用,因需求而应用js在开发中不仅极大程度的避免的耦合性,更使得代码阅读性更强。

从seo方面来说,因需求而引入的文件。相对于毫无章法的全部引入更加便于seo优化,及提升用户体验感。

那么在实际开发中我们可以如何实现,根据需求动态创建script并引入指定的第三方js呢?

完整代码如下:

var url = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js";
//创建一个 script dom元素
// doc需要补全document
var jsapi = document.createElement("script");
//设定script标签属性
jsapi.charset = "utf-8";
jsapi.src = url;
//将API文件引入页面中,加载完毕以后会调用函数
document.head.appendChild(jsapi);

如上代码所示,即完成了对于页面动态引入js文件的操作。

当然在实际的应用,需要根据实际的需求来创建第三方的js文件,并进行引入。

六月初字帖坊小程序 你想要的字帖模板及工具,这里都有!