js 操绘制片的各种效果 第三篇
日期：2014-05-16 浏览次数：20356 次
js 操作图片的各种效果 第三篇
?21 ，js导出图片到excel
<HTML>
<HEAD>
<TITLE>将页面中指定表格的数据导入到Excel中</TITLE>
<SCRIPT LANGUAGE="javascript">
function AutomateExcel()
{
var oExcel = new ActiveXObject("Excel.Application"); //创建Excel对象
var oWork = oExcel.Workbooks.Add(); //新建一个Excel工作簿
var oSheet = oWork.ActiveSheet; //指定要写入内容的工作表为活动工作表
var table = document.all.myTbl; //指定要写入的数据源的id
var myRow = table.rows.length; //取数据源行数
var myCell = table.rows(0).cells.length; //取数据源列数
for (i=0;i<myRow;i++){//在Excel中写行
for (j=0;j<myCell;j++){//在Excel中写列
//定义格式
oSheet.Cells(i+1,j+1).Font.Bold = true;//加粗
oSheet.Cells(i+1,j+1).Font.Size = 10;//字体大小
if(table.rows(i).cells(j).innerHTML.toLowerCase().indexOf('<img')!=-1){//如果其HTML代码包括<img
oSheet.Cells(i+1,j+1).Select();//选中Excel中的单元格
oSheet.Pictures.Insert(table.rows(i).cells(j).getElementsByTagName('img')[0].src);//插入图片
}
else{
oSheet.Cells(i+1,j+1).value = table.rows(i).cells(j).innerText;//向单元格写入值
}
}
}
oExcel.Visible = true;
oExcel.UserControl = true;
}
</SCRIPT>
</HEAD>
<BODY>
<table border="1" width="500" id="myTbl" bgcolor="blue">
<tr bgcolor="white">
<td> 姓名</td>
<td>年龄</td>
<td>地址</td>
<td>照片</td>
</tr>
<tr bgcolor="white">
<td>张三</td>
<td>22</td>
<td>北京海淀</td>
<td><img src="logo1.gif" border="0"></td>
</tr>
<tr bgcolor="white">
<td>李四</td>
<td>23</td>
<td>上海浦东</td>
<td><Img src="logo2.gif" border="0"></td>
</tr>
</table>
<input type="button" name="export" onclick="AutomateExcel();" value="导出到Excel">
</BODY>
</HTML>
?
22，vml 制作随鼠标变大小的圆
<html Xmlns:v="urn:schemas-microsoft-com:vml">
<style>
<!--
v\:* {behavior:url(#default#VML);}
-->
</style>
<body onmousemove='with(document.all.test.style){width=event.x;height=event.y;}'>
<v:oval id=test style="width: 100; height: 100">
<v:stroke weight="1px" color="navy"/>
</v:oval>
</body>
</html>
?
23，js做的结构流程图
<html>
<head>
<title>组织结构图</title>
<style>
.ItemCss
{
position:absolute;
width:24px;
border:1px solid #999999;
font-size:12px;
padding:5px;
height:70px;
z-index:9;
background-color:#FFFFFF;
line-height:16px;
}
a
{
text-decoration:none;
color:#333333;
}
.divhline
{
position:absolute;
z-index:17;
padding:0px;
margin:0px;
border-top:1px solid #999999;
}
.divvline
{
color:blue;
position:absolute;
background-color:#999999;
width:1px;
z-index:17;
}
</style>
<script language="javascript">
var dItem = new Array();
var w = 600;
var h = 40;
var iw = 60;
var ih = 70;
var boxh = 70;
var startleft = 350;
var starttop = 30;
var hr = "<hr size=\"1\" noshade>"
var labledv = "<div class=\"ItemCss\" style=\""
var hdv = "<div class=\"divhline\" style=\"width:";
var vdv = "<div class=\"divvline\" style=\"height:" + h + "px;\"";
var endsdv = "\">";
var enddv = "</div>";
var htm = "";
var len;
var maxn=0; //深度初始变量
function createStruct()
{
dItem[0] = "1|教育部|0|"; //设置要显示的结构内容-以“|”间隔
dItem[1] = "2|东部教育局|1|"; //注意第三项为父级节点
dItem[2] = "3|西部教育局|1|";
dItem[3] = "4|东部高校|2|";
dItem[4] = "5|东部高中|2|";
dItem[5] = "6|商务代表|5|";
dItem[6] = "7|东部初中|2|";
dItem[7] = "8|西部高校|3|";
dItem[8] = "9|西部高中|3|";
len = dItem.length; //获取结构数组的长度
Set_Item(0,0); //设置开始的节点
Set_Max();
Write_Item(0,0,0,1
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
