动态加载 js css的类

原创
2016-06-07 11:43:06 841浏览

一个动态加载 js 和 css 的类
虽然很少用,但是还是用到了
自己改的/**
* YLoader
* 动态加载 js css
* 用法
*
* var yLoader = new YLoader();
*
* 1. 动态加载js
* yLoader.use('http://xxx.com/static/js/jquery.js');
* 2. 动态加载js后执行方法
* yLoader.use('http://xxx.com/static/js/jquery.js', function(){...});
* 3. 动态加载css
* yLoader.use('http://xxx.com/static/css/home.css');
*/
function YLoader() {
this.doc = document;
this.IS_CSS_REG = /\.css(?:\?|$)/i;
this.READY_STATE_REG = /^(?:loaded|complete|undefined)$/;

// bug fix
// `onload` event is not supported in WebKit // ref:
// - https://bugs.webkit.org/show_activity.cgi?id=38995
// - https://bugzilla.mozilla.org/show_bug.cgi?id=185236
// - https://developer.mozilla.org/en/HTML/Element/link#Stylesheet_load_events
this.isOldWebKit = (window.navigator.userAgent.replace(/.*AppleWebKit\/(\d+)\..*/, "$1")) * 1 // For some cache cases in IE 6-8, the script executes IMMEDIATELY after
// the end of the insert execution, so use `currentlyAddingScript` to
// hold current node
this.currentlyAddingScript = '';
this.head = this.doc.getElementsByTagName('head')[0];
// ref: #185 & http://dev.jquery.com/ticket/2709
this.baseElement = this.head.getElementsByTagName("base")[0];
}
YLoader.prototype = {
constructor : YLoader
,isFunction : function(fn) {
return "[object Function]" === Object.prototype.toString.call(fn);
}
,pollCss : function(node, callback) {
var _self = this;
var sheet = node.sheet;
var isLoaded = false;

// for WebKit if(_self.isOldWebKit) {
if(sheet) {
isLoaded = true;
}
} else {
if (sheet) { // for Firefox try {
if(sheet.cssRules) {
isLoaded = true;
}
} catch (ex) {
// The value of `ex.name` is changed from "NS_ERROR_DOM_SECURITY_ERR"
// to "SecurityError" since Firefox 13.0. But Firefox is less than 9.0
// in here, So it is ok to just rely on "NS_ERROR_DOM_SECURITY_ERR"
if(ex.name === "NS_ERROR_DOM_SECURITY_ERR") {
isLoaded = true;
}
}
}
}

setTimeout(function() {
if (isLoaded) {
// Place callback here to give time for style rendering
_self.isFunction(callback) && callback();
} else {
_self.pollCss(node, callback);
}
}, 50);
}
,addOnload : function(node, callback, isCss) {
var _self = this;
var missingOnload = isCss && (_self.isOldWebKit || !("onload" in node));
// for Old WebKit and Old Firefox
if(missingOnload) {
setTimeout(function() {
_self.pollCss(node, callback);
}, 10); // Begin after node insertion
return;
}

node.onload = node.onerror = node.onreadystatechange = function() {
if(_self.READY_STATE_REG.test(node.readyState)) {
// Ensure only run once and handle memory leak in IE
node.onload = node.onerror = node.onreadystatechange = null;
// Remove the script to reduce memory leak
if(!isCss) {
_self.head.removeChild(node);
}
// Dereference the node
node = null;
_self.isFunction(callback) && callback();
}
};
}
,use : function(url, callback, charset) {
var isCss = this.IS_CSS_REG.test(url);
var node = this.doc.createElement(isCss ? "link" : "script");
if(undefined != charset) {
node.charset = charset;
}
this.addOnload(node, callback, isCss);
if (isCss) {
node.rel = "stylesheet";
node.href = url;
} else {
node.async = true;
node.src = url;
}
this.currentlyAddingScript = node;

// ref: #185 & http://dev.jquery.com/ticket/2709
this.baseElement ?
this.head.insertBefore(node, this.baseElement) :
this.head.appendChild(node);

this.currentlyAddingScript = null;
}
};

附件 YLoader.js.rar ( 1.64 KB 下载:20 次 )

AD:真正免费,域名+虚机+企业邮箱=0元

声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。