在JS文件中调用外部CSS文件
我有一个HTML页面,原来是用框架调用的。感觉有时候不好用,现在准备换成JS的。但出现问题了。因为我的代码是<!DOCTYPEhtmlPUBLIC"-//W3C//DTD...
我有一个HTML页面,原来是用框架调用的。感觉有时候不好用,现在准备换成JS的。但出现问题了。因为我的代码是
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>网页标题</title>
<link rel="stylesheet" href="/skin/pl/default.css" type="text/css" />
</head>
<body>
…………
</body>
</html>
中间省略部分。有HTML代码,中间的DIV层。都需要用到以上CSS文件中的样式,但通过引用页面显示的时候。CSS无法正常加载,如何解决,我的JS代码是这样的:
document.writeln("<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD XHTML 1.0 Strict\/\/EN\" \"http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-strict.dtd\">");
document.writeln("<html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">");
document.writeln("<head>");
document.writeln("<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=gb2312\" \/>");
document.writeln("<title>网页标题<\/title>");
document.writeln("<link rel=\"stylesheet\" href=\"\/skin\/pl\/default.css\" type=\"text\/css\" \/>");
document.writeln("<\/head>");
document.writeln("<body>") 展开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>网页标题</title>
<link rel="stylesheet" href="/skin/pl/default.css" type="text/css" />
</head>
<body>
…………
</body>
</html>
中间省略部分。有HTML代码,中间的DIV层。都需要用到以上CSS文件中的样式,但通过引用页面显示的时候。CSS无法正常加载,如何解决,我的JS代码是这样的:
document.writeln("<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD XHTML 1.0 Strict\/\/EN\" \"http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-strict.dtd\">");
document.writeln("<html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">");
document.writeln("<head>");
document.writeln("<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=gb2312\" \/>");
document.writeln("<title>网页标题<\/title>");
document.writeln("<link rel=\"stylesheet\" href=\"\/skin\/pl\/default.css\" type=\"text\/css\" \/>");
document.writeln("<\/head>");
document.writeln("<body>") 展开
5个回答
展开全部
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 = 0; i < lists.length; i++) {
if (lists[i].getAttribute("href").indexOf(".css") != -1) == -1) {
lists[i].parentNode.removeChild(lists[i]);
}
}
上面的判断语句中可以加入自己的判断。
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 = 0; i < lists.length; i++) {
if (lists[i].getAttribute("href").indexOf(".css") != -1) == -1) {
lists[i].parentNode.removeChild(lists[i]);
}
}
上面的判断语句中可以加入自己的判断。
展开全部
有点不明白你的意思。
是不是这样: 你的一个html页面里面本来包含一个框架页,后来你想把框架页换成一个js包含进去。
页面加载 js 跟 框架 是不一样的。
框架里的页面是独立的,不能共享父页面的css。js就不一样了,他用的是父页面的css。
最简单的是你先把你框架页<body> ………… </body>之间的代码写进父页面,用的css也写在父页面,然后看显示时候正常,再把这段代码写到js里,引进去OK了。
是不是这样: 你的一个html页面里面本来包含一个框架页,后来你想把框架页换成一个js包含进去。
页面加载 js 跟 框架 是不一样的。
框架里的页面是独立的,不能共享父页面的css。js就不一样了,他用的是父页面的css。
最简单的是你先把你框架页<body> ………… </body>之间的代码写进父页面,用的css也写在父页面,然后看显示时候正常,再把这段代码写到js里,引进去OK了。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
不懂,你可以找JS的页面去下载源文件对比啊。
看看哪不一样。哪出现问题。纯属建议,别说我装比
看看哪不一样。哪出现问题。纯属建议,别说我装比
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
为什么用document.writeln重写一个页呢,直接写HTML页面不是更好?
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询