JS实现动态添加外部js、css到head标签的方法


Posted in Javascript onJune 05, 2019

本文实例讲述了JS实现动态添加外部js、css到head标签的方法。分享给大家供大家参考,具体如下:

function appendJQCDN() {
   var head = document.head || document.getElementsByTagName('head')[0];
   var script = document.createElement('script');
   var style = document.createElement('style');
   script.setAttribute("src", "https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js");
   style.innerHTML = '';
   head.appendChild(script);
   head.appendChild(style);
}

动态添加 js

function loadScript(url, callback) {
   var script = document.createElement("script");
   script.type = "text/javascript";
   if (typeof (callback) != "undefined") {
     if (script.readyState) {
       script.onreadystatechange = function () {
         if (script.readyState == "loaded" || script.readyState == "complete") {
           script.onreadystatechange = null;
           callback();
         }
       };
     } else {
       script.onload = function () {
         callback();
       };
     }
   };
   script.src = url;
   document.body.appendChild(script);
}
loadScript("https://cdn.bootcss.com/jquery/3.2.1/jquery.js", function() { 
   //加载,并执行回调函数
   alert('动态引入jquery成功')
});

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript XMLHttpRequest对象全面剖析
Apr 24 Javascript
Jquery CheckBox全选方法代码附js checkbox全选反选代码
Jun 09 Javascript
通过正则表达式实现表单验证是否为中文
Feb 18 Javascript
javascript创建cookie、读取cookie
Mar 31 Javascript
javascript实现简易计算器的代码
May 31 Javascript
基于jQuery实现一个marquee无缝滚动的插件
Mar 09 Javascript
JavaScript定时器setTimeout()和setInterval()详解
Aug 18 Javascript
vue项目优化之通过keep-alive数据缓存的方法
Dec 11 Javascript
详解Angular结合zTree异步加载节点数据
Jan 20 Javascript
vue 权限认证token的实现方法
Jul 17 Javascript
Vue CLI 3.x 自动部署项目至服务器的方法
Apr 02 Javascript
Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
Apr 26 Javascript
JS函数动态传递参数的方法分析【基于arguments对象】
Jun 05 #Javascript
jQuery操作cookie的示例代码
Jun 05 #jQuery
JS实现从对象获取对象中单个键值的方法示例
Jun 05 #Javascript
微信小程序如何实现全局重新加载
Jun 05 #Javascript
JS数组Object.keys()方法的使用示例
Jun 05 #Javascript
express + jwt + postMan验证实现持久化登录
Jun 05 #Javascript
Vue实现微信支付功能遇到的坑
Jun 05 #Javascript
You might like
php session_start()关于Cannot send session cache limiter - headers already sent错误解决方法
2009/11/27 PHP
PHP的5个安全措施小结
2012/07/17 PHP
php二维数组转成字符串示例
2014/02/17 PHP
微信access_token的获取开发示例
2015/04/16 PHP
PHP之图片上传类实例代码(加了缩略图)
2016/06/30 PHP
YII2 实现多语言配置的方法分享
2017/01/11 PHP
javascript 选择文件夹对话框(web)
2009/07/07 Javascript
JavaScript 学习笔记(十四) 正则表达式
2010/01/22 Javascript
javascript入门基础之私有变量
2010/02/23 Javascript
把jquery 的dialog和ztree结合实现步骤
2013/08/02 Javascript
jquery遍历之parent()和parents()的区别及parentsUntil()方法详解
2013/12/02 Javascript
简单介绍JavaScript中字符串创建的基本方法
2015/07/07 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
2015/10/26 Javascript
JavaScript无阻塞加载和defer、async详解
2017/02/26 Javascript
Vue-不允许嵌套式的渲染方法
2018/09/13 Javascript
angularJs中json数据转换与本地存储的实例
2018/10/08 Javascript
微信小程序实现复选框效果
2018/12/28 Javascript
Vue 表情包输入组件的实现代码
2019/01/21 Javascript
浅谈Node 异步IO和事件循环
2019/05/05 Javascript
如何通过shell脚本自动生成vue文件详解
2019/09/10 Javascript
JavaScript使用canvas绘制随机验证码
2020/02/17 Javascript
使用IPython下的Net-SNMP来管理类UNIX系统的教程
2015/04/15 Python
Python类定义和类继承详解
2015/05/08 Python
在Django的URLconf中进行函数导入的方法
2015/07/18 Python
Python的多维空数组赋值方法
2018/04/13 Python
Python 中list ,set,dict的大规模查找效率对比详解
2019/10/11 Python
html5的canvas实现3d雪花飘舞效果
2013/12/27 HTML / CSS
EJB的基本架构
2016/09/22 面试题
工程造价专业大学生职业规划范文
2014/03/09 职场文书
厨师长岗位职责范本
2014/08/25 职场文书
承兑汇票转让证明怎么写?
2014/11/30 职场文书
银行资信证明
2015/06/17 职场文书
干部理论学习心得体会
2016/01/21 职场文书
Nginx中break与last的区别详析
2021/03/31 Servers
Matlab求解数组中的最大值及它所在的具体位置
2021/04/16 Python
PHP 时间处理类Carbon
2022/05/20 PHP