建议在每个页面中使用<link rel="stylesheet" href="CSS1.css地址">放在<head>标签里。通常的做法都是这样的。
根据不同分辨率或不同窗口大小加载不同的css，让网页显示最合适的布局，是网站设计常用到的。一、根据屏幕分辨率大小加载不同CSS.
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<link href="" rel="stylesheet" type="text/css" id="css" /><!--备注：这里写一个带ID="css" 的空的link样式-->
<script>
var w=window.screen.width//先获取屏幕分辨率大小
var c
if(w==1280){
c="a.css"
}else if(w==1024){
c="d.css"
}else if(w==800){
c="c.css"
}else{
c="d.css"
}
document.getElementById("css").href=c
</script>
</head>
<body>正文</body>
</html>
二、根据浏览器窗口大小加载不同CSS
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<link href="" rel="stylesheet" type="text/css" id="css" /><!--备注：这里写一个带ID="css" 的空的link样式-->
<script>
var w=document.documentElement?document.documentElement.clientWidth:document.body.clientWidth//先获取窗口宽度
var c
if(w>=1280){
c="a.css"
}else if(w>=1024){
c="d.css"
}else if(w>=800){
c="c.css"
}else{
c="d.css"
}
document.getElementById("css").href=c
</script>
</head>
<body>正文</body>
</html>
JS文件中动态调用外部css, 文件方法如下:function loadExtentFile(filePath, fileType){
if(fileType == "js"){
var oJs = document.create_rElement('script')
oJs.setAttribute("type","text/javascript")
oJs.setAttribute("src", filename)//文件的地址 ,可为绝对及相对路径
document.getElementsByTagName_r("head")[0].appendChild(oJs)//绑定
}else if(fileType == "css"){
var oCss = document.create_rElement("link")
oCss.setAttribute("rel", "stylesheet")
oCss.setAttribute("type", "text/css")
oCss.setAttribute("href", filename)
document.getElementsByTagName_r("head")[0].appendChild(oCss)//绑定
}
}
loadExtentFile("js/func.js", "js")
loadExtentFile("default.css", "css")
清空:
var lists = document.getElementsByTagName_r("link")
for ( var i = 0i <lists.lengthi++) {
if (lists[i].getAttribute("href").indexOf(".css") != -1) == -1) {
lists[i].parentNode.removeChild(lists[i])
}
}
上面的判断语句中可以加入自己的判断。
