怎么在新打开的窗口中加载object.innerHTML()内的CSS
日期：2014-05-16 浏览次数：20338 次
如何在新打开的窗口中加载object.innerHTML()内的CSS?
我现在用document.createStyleSheet( "css/style_1.css "); 给一个创建的table加载CSS(table创建在DIV层里),我用div.innerHTML()显示创建的层,但当我click "在新窗口中打开创建的表格 "的按钮时,只显示创建的table,却没有CSS样式,
说的不太清楚,我把代码放上来,大家看了就会明白的
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN ">
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> 无标题文档 </title>
<script language= "javascript ">
function table_1(){
var mytable=document.createElement( "table ");
var mytbody=document.createElement( "tbody ");
var mytr=document.createElement( "tr ");
var mytd=document.createElement( "td ");
var mytr_1=document.createElement( "tr ");
var mytd_1=document.createElement( "td ");
var mytext=document.createTextNode( "这是表格1文字效果 ");
var mytext_1=document.createTextNode( "这是表格2的文字效果 ");
mytable.id= "tablemessage ";
mytd.appendChild(mytext);
mytr.appendChild(mytd);
mytr.appendChild(mytd_1);
mytd_1.appendChild(mytext_1);
mytbody.appendChild(mytr);
mytable.appendChild(mytbody);
wins.appendChild(mytable);
mytable.setAttribute( "border ", "2 ")
mytable.setAttribute( "cellpadding ", "2 ");
mytable.setAttribute( "cellspacing ", "2 ");
mytable.style.width= "400px ";
mytable.style.height= "400px "
mytd.style.width= "150px "
mytd_1.style.width= "450 "
}
function w(){
if(wins.innerHTML!= " "){
var win = window.open( "about:blank ");
win.document.open();
win.document.write(wins.innerHTML);
}
else{
alert( "您没有选择模版 ")
}
}
function cssStyle(){
document.createStyleSheet( "css/style_1.css ");
}
</script>
</head>
<body>
<div id= "wins " style= "height:460; width:674;overflow:auto; "> </div>
<input name= "button " type= "button " onClick= "table_1() " value= "创建表格 ">
<input type= "button " name= "Submit2 " value= "为创建的表格加载CSS " onClick= "cssStyle() ">
<input type= "button " name= "Submit " value= "在新窗口中打开创建的表格 " onClick= "w() ">
</body>
</html>
------解决方案--------------------
function cssStyle(){
var oCSS = document.createStyleSheet( "css/style_1.css ");
document.getElementsByTagName( "head ")[0].appendChild(oCSS);
}
------解决方案--------------------
同意stefli你的代码没错的, "为创建的表格加载CSS "效果只在本窗口有效
"但当我click "在新窗口中打开创建的表格 "的按钮时,只显示创建的table,却没有CSS样式, "
因为你在新窗口里没有加载CSS样式所以不会有效果,除非你在函数里把样式加到新窗口里面改了一下w()如下
function w(){
if(wins.innerHTML!= " "){
var win = window.open( "about:blank ");
我现在用document.createStyleSheet( "css/style_1.css "); 给一个创建的table加载CSS(table创建在DIV层里),我用div.innerHTML()显示创建的层,但当我click "在新窗口中打开创建的表格 "的按钮时,只显示创建的table,却没有CSS样式,
说的不太清楚,我把代码放上来,大家看了就会明白的
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN ">
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> 无标题文档 </title>
<script language= "javascript ">
function table_1(){
var mytable=document.createElement( "table ");
var mytbody=document.createElement( "tbody ");
var mytr=document.createElement( "tr ");
var mytd=document.createElement( "td ");
var mytr_1=document.createElement( "tr ");
var mytd_1=document.createElement( "td ");
var mytext=document.createTextNode( "这是表格1文字效果 ");
var mytext_1=document.createTextNode( "这是表格2的文字效果 ");
mytable.id= "tablemessage ";
mytd.appendChild(mytext);
mytr.appendChild(mytd);
mytr.appendChild(mytd_1);
mytd_1.appendChild(mytext_1);
mytbody.appendChild(mytr);
mytable.appendChild(mytbody);
wins.appendChild(mytable);
mytable.setAttribute( "border ", "2 ")
mytable.setAttribute( "cellpadding ", "2 ");
mytable.setAttribute( "cellspacing ", "2 ");
mytable.style.width= "400px ";
mytable.style.height= "400px "
mytd.style.width= "150px "
mytd_1.style.width= "450 "
}
function w(){
if(wins.innerHTML!= " "){
var win = window.open( "about:blank ");
win.document.open();
win.document.write(wins.innerHTML);
}
else{
alert( "您没有选择模版 ")
}
}
function cssStyle(){
document.createStyleSheet( "css/style_1.css ");
}
</script>
</head>
<body>
<div id= "wins " style= "height:460; width:674;overflow:auto; "> </div>
<input name= "button " type= "button " onClick= "table_1() " value= "创建表格 ">
<input type= "button " name= "Submit2 " value= "为创建的表格加载CSS " onClick= "cssStyle() ">
<input type= "button " name= "Submit " value= "在新窗口中打开创建的表格 " onClick= "w() ">
</body>
</html>
------解决方案--------------------
function cssStyle(){
var oCSS = document.createStyleSheet( "css/style_1.css ");
document.getElementsByTagName( "head ")[0].appendChild(oCSS);
}
------解决方案--------------------
同意stefli你的代码没错的, "为创建的表格加载CSS "效果只在本窗口有效
"但当我click "在新窗口中打开创建的表格 "的按钮时,只显示创建的table,却没有CSS样式, "
因为你在新窗口里没有加载CSS样式所以不会有效果,除非你在函数里把样式加到新窗口里面改了一下w()如下
function w(){
if(wins.innerHTML!= " "){
var win = window.open( "about:blank ");
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
