利用JavaScript加载css、js文件

📅 2019-12-24 👤 超级管理员

🤖 AI摘要

文章演示了使用DOM操作动态加载外部资源的JavaScript方法，提供link和script函数分别处理CSS和JS文件。link函数创建link元素并设置rel类型为stylesheet、type为text/css及指定href属性，script函数创建script元素并设置type和src属性。执行时调用函数并传入文件路径，通过将生成的元素添加至文档头部实现资源按需加载，优化网页性能和加载流程，适用于需要控制资源加载顺序的网页开发场景。

//加载css文件函数 
function link(url) {
  var link = document.createElement("link");
  link.rel = "stylesheet";
  link.type = "text/css";
  link.href = url;
  document.getElementsByTagName("head")[0].appendChild(link);
}
//加载css文件函数 

//加载js文件函数 
function script(url) {
  var newscript = document.createElement('script');
  newscript.setAttribute('type','text/javascript');
  newscript.setAttribute('src',url);
  var head = document.getElementsByTagName('head')[0];
  head.appendChild(newscript);
}
//加载js文件函数 

script("js文件链接");
//执行加载js文件
link("css文件的链接");
//执行加载css文件

您正在浏览AMP加速版本，评论功能在完整版中可用。

查看完整版本