用 Javascript 动态加载一个 CSS 文件的方法很简单,但是如果想要加载一个 CSS STYLE 元素,里面写入一些 CSS 语句就没有那么简单了。不过也难不倒我们,查一查 MSDN 和 Mozilla 的开发网站就可以写出来了,下面的语句兼容了 IE,Firefox,Safari,Opera 没有测试。
- function AttachStyle(ownDoc,styCss) {
- var elmSty = ownDoc.createElement('STYLE');
- elmSty.setAttribute("type", "text/css");
- if (elmSty.styleSheet) {
- elmSty.styleSheet.cssText=styCss;
- } else {
- elmSty.appendChild(ownDoc.createTextNode(styCss));
- }
- ownDoc.getElementsByTagName("head")[0].appendChild(elmSty);
- }
本日志由 Loveyuki 于 2008-01-31 15:21 发表,目前已经被浏览 1665 次,评论 10 次;
作者添加了以下标签: Javascript,动态加载,Firefox,Internet Explorer,Safari;
引用通告:http://www.loveyuki.com/Article/45/Trackback.ashx
function AttachStyle(){
this.load=function(URL) {
var css=document.createElement('link');
css.type="text/css";
css.rel="="stylesheet";
css.src=URL;
var head=document.getElementsByTagName("head")[0];
head.appendChild(css);
var self=this;
css.onload=css.onreadystatechange=function(){
if(this.readyState&&this.readyState=="loading") return;
self.onsuccess();
}
css.onerror=function(){
head.removeChild();
self.onfailure();
}
}
this.onsuccess=function(){}//加载成功事件
this.onfailure=function(){}//加载失败事件
}
Loveyuki 发表于 2008-01-31 23:09 #css.rel="stylesheet"; //貌似 30分钟内修改评论不能用?
暂时不能用的。呵呵。解释型的语言不要太 OO。银蛋是不存在的。
loveyuki重新开张了,贺一下。
先报告一个小BUG:http://www.loveyuki.comArticle/45/Feeds.ashx路径中少了一个/,所有的页面里的“引用通告”和“评论订阅”基本上都少这个,路径错了。
wllllll 发表于 2008-06-10 14:25 #一楼,这个东西怎么不适合ajax了呢,先下载数据,再用这个书写。
怎么会不适合ajax呢。真奇怪了。
用js下载css,再用此函数书写css,不一样是ajax