jquery动态加载js/css文件方法(自写小函数)


Posted in Javascript onOctober 11, 2014

先来看jquery自带的getSrcript文件

方法

$.getScript(url,callback)

实例

var testVar = 'New JS loaded!';

alert(testVar); function newFun(dynParam) {

alert('You just passed '+dynParam+ ' as parameter.');

}

动态调用方法
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript">
$(function()
{
$('#loadButton').click(function(){
$.getScript('new.js',function(){
newFun('"Checking new script"');//这个函数是在new.js里面的,当点击click后运行这个函数
});
});
});
</script>
</head>
<body>
<button type="button" id="loadButton">Load</button>

上面的只能动态加载js代码,但不能加载css,后来自己写了一个可加载js与css的程序。

代码如下

$.extend({

includePath: '',

include: function(file)

{

var files = typeof file == "string" ? [file] : file;

for (var i = 0; i < files.length; i++)

{

var name = files[i].replace(/^s|s$/g, "");

var att = name.split('.');

var ext = att[att.length - 1].toLowerCase();

var isCSS = ext == "css";

var tag = isCSS ? "link" : "script";

var attr = isCSS ? " type='text/css' rel='stylesheet' " : " language='javascript' type='text/javascript' ";

var link = (isCSS ? "href" : "src") + "='" + $.includePath + name + "'";

if ($(tag + "[" + link + "]").length == 0) document.write("<" + tag + attr + link + "></" + tag + ">");

}

}

});

$.include(['hdivbox.js','pop_win.css']);
Javascript 相关文章推荐
使用EXT实现无刷新动态调用股票信息
Nov 01 Javascript
getJSON调用后台json数据时函数被调用两次的原因猜想
Sep 29 Javascript
jquery动态加载select下拉框示例代码
Dec 10 Javascript
javascript表单控件实例讲解
Sep 13 Javascript
bootstrap weebox 支持ajax的模态弹出框
Feb 23 Javascript
Angular.js 4.x中表单Template-Driven Forms详解
Apr 25 Javascript
微信小程序实现YDUI的ScrollTab组件
Feb 02 Javascript
vue中的mvvm模式讲解
Jan 31 Javascript
Vue-cli3项目引入Typescript的实现方法
Oct 18 Javascript
vue 获取元素额外生成的data-v-xxx操作
Sep 09 Javascript
详解Javascript实践中的命令模式
May 05 Javascript
vue组件冲突之引用另一个组件出现组件不显示的问题
Apr 13 Vue.js
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
Oct 11 #Javascript
JavaScript中实现最高效的数组乱序方法
Oct 11 #Javascript
JavaScript中实现PHP的打乱数组函数shuffle实例
Oct 11 #Javascript
JavaScript定义变量和变量优先级问题探讨
Oct 11 #Javascript
JavaScript中获取鼠标位置相关属性总结
Oct 11 #Javascript
JavaScript中最简洁的编码html字符串的方法
Oct 11 #Javascript
原生Javascript封装的一个AJAX函数分享
Oct 11 #Javascript
You might like
Eclipse中php插件安装及Xdebug配置的使用详解
2013/04/25 PHP
ThinkPHP利用PHPMailer实现邮件发送实现代码
2013/09/26 PHP
php使用exec shell命令注入的方法讲解
2013/11/12 PHP
学习php设计模式 php实现模板方法模式
2015/12/08 PHP
一段实用的php验证码函数
2016/05/19 PHP
php利用ZipArchive类操作文件的实例
2020/01/21 PHP
PHP isset empty函数相关面试题及解析
2020/12/11 PHP
JavaScript移除数组元素减少长度的方法
2013/09/05 Javascript
js根据日期判断星座的示例代码
2014/01/23 Javascript
JQuery EasyUI 数字格式化处理示例
2014/05/05 Javascript
在css加载完毕后自动判断页面是否加入css或js文件
2014/09/10 Javascript
cocos2dx骨骼动画Armature源码剖析(三)
2015/09/08 Javascript
谈谈JavaScript异步函数发展历程
2015/09/29 Javascript
jQuery操作dom实现弹出页面遮罩层(web端和移动端阻止遮罩层的滑动)
2016/08/25 Javascript
微信开发 使用picker封装省市区三级联动模板
2016/10/28 Javascript
使用JQ完成表格隔行换色的简单实例
2017/08/25 Javascript
iframe高度自适应及隐藏滚动条的实例详解
2017/09/29 Javascript
js中getBoundingClientRect的作用及兼容方案详解
2018/02/01 Javascript
javascript中innerHTML 获取或替换html内容的实现代码
2020/03/17 Javascript
Node.js API详解之 console模块用法详解
2020/05/12 Javascript
详解Vue中Axios封装API接口的思路及方法
2020/10/10 Javascript
[02:26]DOTA2英雄米拉娜基础教程
2013/11/25 DOTA
Python使用pygame模块编写俄罗斯方块游戏的代码实例
2015/12/08 Python
简介Python的collections模块中defaultdict类型的用法
2016/07/07 Python
Python导入模块时遇到的错误分析
2017/08/30 Python
Python3简单实现串口通信的方法
2019/06/12 Python
python re.sub()替换正则的匹配内容方法
2019/07/22 Python
对django中foreignkey的简单使用详解
2019/07/28 Python
如何安装2019Pycharm最新版本(详细教程)
2019/09/26 Python
详解Python之Scrapy爬虫教程NBA球员数据存放到Mysql数据库
2021/01/24 Python
运动会广播稿200字
2014/01/15 职场文书
学校做一个有道德的人活动方案
2014/08/23 职场文书
针对吵架老公保证书
2015/05/08 职场文书
入党介绍人意见2015
2015/06/01 职场文书
2015党建工作简报
2015/07/21 职场文书
Docker安装MySql8并远程访问的实现
2022/07/07 Servers