您的位置：首页 > Web前端 > JavaScript

使用javascript动态加载外部css或js文件

2008-05-31 22:06 1146 查看

几天没写东西了，这几天真是比较懒惰，今天总算写了点小东西呵呵，很简单的东西，也参考了很多网络资源，动态加载css或js文件的实际应用有很多，不用我介绍了，大家肯定都感受过，比如不刷新页面切换css，一些大的门户网站的js文件也是动态加载的，比如网易等等。其实原理非常简单无法就是dhtml罢了，废话不说了，放代码。

csdn博客又出问题了，不能插入html了，晕，真不好用。大家将就着看吧。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript">
function loadFile(filePath, type){
var element=null;
if (type=="js"){
element=document.createElement('script')
element.setAttribute("type","text/javascript")
element.setAttribute("src", filePath)
}else if (type=="css"){
element=document.createElement("link")
element.setAttribute("rel", "stylesheet")
element.setAttribute("type", "text/css")
element.setAttribute("href", filePath)
}else{
return ;
}
var eHead=document.getElementsByTagName("head");
if(eHead!=null)
eHead[0].appendChild(element)
}
</script>
</head>
<body>
<div><a href="javascript:loadFile('default1.css', 'css')">red</a></div>
<div><a href="javascript:loadFile('default2.css', 'css')">blue</a></div>
<div><a href="javascript:loadFile('alert.js', 'js')">alert</a></div>
</body>
</html>

default1.css
* {
background: red;
}

default2.css

* {
background: blue;
}

alert.js

alert("abc")

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航