＋设为首页 ＋添加到收藏夹
我写了段代码，可没有效果，为什么呢？
// Create TABLE element
try{
var aTable = document.createElement("TABLE");
if(typeof(aTable)==object && (aTable != null))
{
document.body.appendChild(aTable);
aTable.border = 0;
aTable.cellSpacing = 0;
aTable.cellpadding = 4;
aTable.cols = 4;
aTable.width = "80%";
aTable.align = "center";
for(var i=0;i<4;i++)
{
var aTr = document.createElement("TR");
if(typeof(aTr)==object && (aTr != null))
{
aTable.appendChild(aTr);
for(var j=0;j<4;j++)
{
var aTd = document.createElement("TD");
if(typeof(aTd)==object && (aTd != null))
{
aTr.appendChild(aTd);
var vl = i + "_" + j + ".htm";
var vt = "Item(" + i + "," + j + ")";
aTd.innerHTML = "<A HREF=" + vl + ">" + vt + "</A>";
window.alert("Create TD item succeeded! innerText = " + aTd.innerText + ".");
}
}
}
}
}
}catch(e){
window.alert("Java script error when create table!");
}
不要用createElement方法建立对象，因为它只建立对象的最基本内容。
<script>
function createObj(){
s=<table border=1>;
s=s+<tr>
s=s+<td>灰豆宝宝.net</td>;
s=s+<td>灰豆宝宝.net</td>;
s=s+</tr>
s=s+<tr>
s=s+<td>灰豆宝宝.net</td>;
s=s+<td>灰豆宝宝.net</td>;
s=s+</tr>
s=s+</table>
obj1.innerHTML=s;
}
</script>
<br/><input type=button value="建立表格" onclick=createObj()>
<span id=obj1>建立表格</span>
给你一段，可直接拿来用哦
<HTML>
<BODY>
<script>
hy = new Object();
// +----------------------------------------------------+
// | 创建表格类 |
// +----------------------------------------------------+
hy.cT = function()
{
var args, ot, rc, cc, i, j, rw, itd, _pa, as, xx, nn;
as = {bgc:bgcolor, bg:backgorund, h:height, cN:className, oC:onClick, style:STYLE, oDC:onDoubleClick, oMO:onMouseOver, oMOu:onMouseOut, oMD:onMouseDown, oMU:onMouseUp, w:width, cp:cellpadding, cs:cellspacing, iH:innerHTML, br:border}; //as::attributes初始化table,tr,td的所有属性列表
args = hy.cT.arguments; //得到参数列表
_pa = function(obj) //pa::public_attributes生成所有属性
{
var nm;
for (nm in xx) { //nm::name公用属性名称
eval(obj. + nm + =xx[nm]); //为table,tr或td的属性赋值
}
if (xx[id]) obj.name = xx[id]; //为table,tr或td的name属性赋值
}
//建立一个表格对象
ot = document.createElement("TABLE");
//表格对象属性
xx = []; //清空数组
for (nn in args[0]) xx[(as[nn]==null?nn:as[nn])] = args[0][nn]; //执行完后xx数组的格式举例:xx[bgcolor] = #ffffaa
if (!xx[cellpadding]) xx[cellpadding] = 0;
if (!xx[cellspacing]) xx[cellspacing] = 0;
if (!xx[border]) xx[border] = 0;
if (!xx[width]) xx[width] = 100%;
_pa(ot); //生成公用属性
if (args.length == 1) return; //如果参数只有一行,直接返回
rc = (args[0][row]?args[0][row]:1); //rc::row_count表格行数
if (rc) cc = (args.length-1-rc)/rc; //cc::colume_count表格列数
for (i=0; i<rc; i++) {
xx = []; //清空数组,以备下一个对象使用
rw = ot.insertRow(i); //建立一行
for (nn in args[(cc + 1)*i + 1]) xx[(as[nn]==null?nn:as[nn])] = args[(cc + 1)*i + 1][nn]; //执行完后xx数组的格式举例:xx[bgcolor] = #ffffaa
_pa(rw); //生成公用属性
for (j=0; j<cc; j++) {
xx = [];
//建立一列
itd = rw.insertCell(j); //itd::insert_td::插入列
//TD对象属性
for (nn in args[(cc + 1)*i + 2 + j]) xx[(as[nn]==null?nn:as[nn])] = args[(cc + 1)*i + 2 + j][nn]; //执行完后xx数组的格式举例:xx[bgcolor] = #ffffaa
if (!xx[width]) xx[width] = 100%;
_pa(itd); //生成公用属性
}
}
return ot.outerHTML; //返回生成的表格字符串
};
//调用创建表格类
var str = hy.cT({row:3, id:aaa, w:100%, br:5, style:border-color:#FF3300;, cp:5, cs:5, oC:alert()},
{h:111, oC:alert(), wwwwww:asdfasdfasdf, id:x},
{id:www, w:136, cN:hyIc2SCL, iH:lsdjfsldkjf, bgc:#6666FF},
{w:4, iH:ph},
{id:bbb, cN:hyIc2SCR, iH:<font color=#FF0066>恍恍惚惚含含糊糊</font>},
{h:1},
{iH:pcbch, on随口的:asdfasdfasdf, onselectstart:return false;, id:qqqqq},
{iH:pcvbxch,id:xxx},
{iH:pxvh,id:www},
{h:1},
{cN:hyIc2SCLL, iH:pxvh},
{iH:pxcvh, 搜索:脸色打击法},
{cN:hyIc2SCRL, iH:pxcvh}
);
document.write(str);
var fso = new ActiveXObject("Scripting.FileSystemObject");
var bbb = fso.CreateTextFile("d:/table.txt", true);
bbb.Write(str);
bbb.Close();
</script>
</BODY>
</HTML>
创建表格类createTable演示:
***直接调用:
------------------------------------------
1.调用的格式:
------------------------------------------
hy.createTable( {row:3, id:aaa, oC:alert("这是table")}, //table属性数组***注意必须设定属性row(行数)的值,下面的行数组个数与此行数对应***
{h:35, id:tr1, cN:classtr}, //第一行
{id:td1, w:100%, iH:<font>td1中的内容</font>}, //第一行,第一列
{id:td2, w:100%, iH:<font>td2中的内容</font>}, //第一行,第二列
{id:td3, w:100%, iH:<font>td3中的内容</font>}, //第一行,第三列
{h:35, id:tr2, cN:classtr}, //第二行
{id:td1, w:100%, iH:<font>td1中的内容</font>}, //第二行,第一列
{id:td2, w:100%, iH:<font>td2中的内容</font>}, //第二行,第二列
{id:td3, w:100%, iH:<font>td3中的内容</font>}, //第二行,第三列
{h:35, id:tr3, cN:classtr}, //第三行
{id:td1, w:100%, iH:<font>td1中的内容</font>}, //第三行,第一列
{id:td2, w:100%, iH:<font>td2中的内容</font>}, //第三行,第二列
{id:td3, w:100%, iH:<font>td3中的内容</font>}, //第三行,第三列
);
以上是假设定义一个三行三列的表,那么第一个参数是table的属性数组(***注意必须设定属性row(行数)的值)(row:3表示表格有三行,id:aaa表示表格的名字....)
第二个参数是第一行(h:35表示tr的高度是35,id:tr1表示tr的id是tr1,cN:classtr表示tr的样式名是classtr)
后面的三个参数是第一个tr的三列(如果是三行四列,那么这句话改为:后面的四个参数是第一个tr的四列. 其他类推)(id:td1表示td的id是td1,w:100%表示td的宽度是100%,iH:<font>td1中的内容</font>表示td的内容是<font>td1中的内容</font>)
再后面一个参数是第二行...
如果你定义的参数只有一行,那么函数生成像这样的字符串<table></table>后返回
------------------------------------------
2.调用举例:
------------------------------------------
------------------------------------------
3.属性祥解:
------------------------------------------
row::表格中的行数 默认值为1行
table,tr,td通用的属性:
1.bgc::bgcolor::背景色
2.bg::backgorund::背景图片
3.h::height::高度
4.cN::className::样式表调用
5.style::STYLE样式
6.id::ID或NAME
7.oMO::onMouseOver::鼠标移动
8.oMOu::onMouseOut::鼠标移出
9.oMD::onMouseDown::鼠标按下
10.oMU::onMouseUp::鼠标抬起
11.oC::onClick::鼠标单击
12.oDC::onDoubleClick::鼠标双击
table独有的属性:
1.br::border::默认值0
2.cp::cellpadding::默认值0
3.cs::cellspacing::默认值0
4.w::width::宽度默认值100%
td独有的属性:
1.iH::innerHTML::内容
2.w::width::宽度,默认值100%
3.align::对齐属性
另外除了以上已定义好的属性外, table,tr,td的属性可任意定制: 例如你可以为td添加一个属性aaa=bbb
-------------------------------------------
