html文件实现动态获取资源,javascript实现动态导入js与css等静态资源文件的方法...

javascript实现动态导入js与css等静态资源文件的方法

发布于 2017-02-07 07:08:17 | 114 次阅读 | 评论: 0 | 来源: 网友投递

JavaScript客户端脚本语言Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言，主要目的是为了解决服务器端语言，比如Perl，遗留的速度问题，为客户提供更流畅的浏览效果。

这篇文章主要介绍了javascript实现动态导入js与css等静态资源文件的方法,基于回调函数实现该功能,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了javascript实现动态导入js与css等静态资源文件的方法。分享给大家供大家参考。具体实现方法如下：

/**

* 动态导入静态资源文件js/css

*/

var $import = function(){

return function(rId, res, callback){

if(res && 'string' == typeof res){

if(rId){

if($($('#' + rId), $('head')).length>0){

return;

}

}

//加载资源文件

var sType = res.substring(res.lastIndexOf('.') + 1);

// 支持js/css

if(sType && ('js' == sType || 'css' == sType)){

var isScript = (sType == 'js');

var tag = isScript ? 'script' : 'link';

var head = document.getElementsByTagName('head')[0];

// 创建节点

var linkScript = document.createElement(tag);

linkScript.type = isScript ? 'text/javascript' : 'text/css';

linkScript.charset = 'UTF-8';

if(!isScript){

linkScript.rel = 'stylesheet';

}

isScript ? linkScript.src = res : linkScript.href = res;

if(callback && 'function' == typeof callback){

if (linkScript.addEventListener){

linkScript.addEventListener('load', function(){

callback.call();

}, false);

} else if (linkScript.attachEvent) {

linkScript.attachEvent('onreadystatechange', function(){

var target = window.event.srcElement;

if (target.readyState == 'complete') {

callback.call();

}

});

}

}

head.appendChild(linkScript);

}

}

};

}();

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

相关阅读:

javascript实现动态导入js与css等静态资源文件的方法

javascript实现获取图片大小及图片等比缩放的方法

JS实现动态移动层及拖动浮层关闭的方法

把JS与CSS写在同一个文件里的书写方法

JavaScript实现复制或剪切内容到剪贴板功能的方法

JavaScript实现弹出模态窗体并接受传值的方法

javascript实现鼠标移到Image上方时显示文字效果的方法

JavaScript实现把rgb颜色转换成16进制颜色的方法

javascript实现可全选、反选及删除表格的方法

Js与Jq 获取页面元素值的方法和差异对比

javascript实现表单提交后，提交按钮不可用的方法

JavaScript实现为指定对象添加多个事件处理程序的方法