日期:2014-05-18  浏览次数:20706 次

包含CSS和DIV的页面如何做导出,格式为DOC,EXECLE,PDF都可以。
HTML code


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<style>
/*div{display:inline;}*/
div{font-size:1px;}
body{text-align:center;}
/*个体*/
.block{
    height:20px;
    background-color:#FFFFFF;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
}
/*内容框架*/
.content{
    height:40px;
    width:120px;
    background-color:#CCCCCC;
    font-size:14px;
    font-family: "新宋体";
    font-weight: bold;
    font-variant: normal;
    font-style: normal;
    word-spacing: normal;
    text-align: center;
    vertical-align: baseline;
    border: thin solid #333333;
    overflow: auto;
    display: run-in;
}

/*坚线*/
.vline{height:10px;width:2px;background-color:black;}
/*横线*/
.hline{height:1px;float:left;background-color:black;}
/*隐藏*/
.hlinebox{display:block;}
/*间隔*/
.middleblock{width:100px;}
/**/
.block, .middleblock{float:left;}

.childs{clear:left}

</style>
</HEAD>
 
<BODY>
    
<div id="Layer1" >
<input type=button name='button_export' title='导出到word'  onclick="OpenWord()" value=" imp word"></div>
</div>
<div class="block" id="m1">
 <div class="vline"></div>
 <div class="content">tree1</div>
 <div class="vline"></div>

 <div class="hlinebox"> <!--隐藏框,隔开元素之间的距离-->
  <div class="middleblock" id="leftblock"></div>
  <div class="hline" id="hline"></div>
  <div class="middleblock" id="rightblock"></div>
 </div>
 
   <div class="childs">
    <div class="block" id="m11">
     <div class="vline"></div>
     <div class="content">tree2</div>
    </div>

    <div class="middleblock"></div>

    <div class="block" id="m11">
     <div class="vline"></div>
     <div class="content">tree3</div>
    </div>
   </div>
  </div>

 <SCRIPT LANGUAGE="JavaScript">

var hline = document.getElementsByName("hline");
var leftblock = document.getElementsByName("leftblock");
var rightblock = document.getElementsByName("rightblock");
var co;


for (var i=0;i<leftblock.length; i++)
{
 co = leftblock[i];
 alert(co)
// alert(co.nodeName) //到得元素名称

 co = co.parentNode.nextSibling;//移位到childs wrap
 alert(co.nodeName)


 //先左
 leftblock[i].style.width = co.childNodes[0].offsetWidth / 2 - 1;
 
 //右
 rightblock[i].style.width = co.childNodes[co.childNodes.length - 1].offsetWidth / 2 - 1;

 //中
 hline[i].style.width = hline[i].parentNode.parentNode.offsetWidth - leftblock[i].offsetWidth - rightblock[i].offsetWidth;
}
</SCRIPT>
<script language="javascript">
function OpenWord(){
Layer1.style.border=0
word = new ActiveXObject('Word.Application');
word.Application.Visible = true;
var mydoc=word.Documents.Add('',0,1);
myRange =mydoc.Range(0,1)
var sel=Layer1.document.body.createTextRange()
sel.select()
Layer1.document.execCommand('Copy')
sel.moveEnd('character')
myRange.Paste();
location.reload()
word.ActiveWindow.ActivePane.View.Type=9


}
</script>
 </BODY>
</HTML>



用户要求把这个的一个树文件导出来,但格式不限制,那位达人做过,给提供个方案。谢谢