在IE和FIREFOX都能用的生成表格方法
上一篇 / 下一篇 2007-05-21 13:41:51 / 精华(4)
function start() {
//获取body标签
var mybody = document.getElementsByTagName("body")[0];
// 创建一个<table>元素和一个<tbody>元素
mytable = document.createElement("table");
mytablebody = document.createElement("tbody");
//创建所有的单元格
for(var j = 0; j < 2; j++) {
// 创建一个<tr>元素
mycurrent_row = document.createElement("tr");
for(var i = 0; i < 2; i++) {
// 创建一个<td>元素
mycurrent_cell = document.createElement("td");
//创建一个文本节点
currenttext = document.createTextNode("单元格是第"+j+"行，第"+i+"列");
// 将创建的文本节点添加到<td>里
mycurrent_cell.appendChild(currenttext);
// 将列<td>添加到行<tr>
mycurrent_row.appendChild(mycurrent_cell);
}
// 将行<tr>添加到<tbody>
mytablebody.appendChild(mycurrent_row);
}
// 将<tbody>添加到<table>
mytable.appendChild(mytablebody);
//将<table>添加到<body>
mybody.appendChild(mytable);
// 将表格mytable的border属性设置为2
mytable.setAttribute("border", "1");
mytable.setAttribute("cellSpacing", "1");
mytable.onclick=function() {show(67);};
//mytable.setAttribute("onClick","show();");
mytablebody.id="gg";
}
function show(str)
{
id=document.getElementById("gg");
alert(str)
// 创建一个<tr>元素
mytr = document.createElement("tr");
//设置样式
mytr.setAttribute("style","text-align: center;background-color: #ff444f;");//FOR OTHER
mytr.style.cssText="text-align: center;background-color: #ff444f;";//FOR IE
// 创建一个<td>元素
mytd0 = document.createElement("td");
//创建一个文本节点
tdtext = document.createTextNode("单元格是第行，第列");
// 将创建的文本节点添加到<td>里
mytd0.appendChild(tdtext);
// 将列<td>添加到行<tr>
mytr.appendChild(mytd0);
mytd1 = document.createElement("td");
mytd1.innerHTML=" <select name='select' id='selectid'><option value ='手动' selected='selected'>手动</option><option value='自动 ' selected='selected'>自动</option></select> <input type ='text' name='money' value='' size='5' id='money'><span id='urlmoney'> <a href=javascript:shouweijia('5445') class=editad>首位价</a> </span>";
mytr.appendChild(mytd1);
// 将行<tr>添加到<tbody>
id.appendChild(mytr);
}
<script>
var mybody = document.getElementsByTagName("body" ) [0];
mytable.onload=function() {show(start();};
</script>
//获取body标签
var mybody = document.getElementsByTagName("body")[0];
// 创建一个<table>元素和一个<tbody>元素
mytable = document.createElement("table");
mytablebody = document.createElement("tbody");
//创建所有的单元格
for(var j = 0; j < 2; j++) {
// 创建一个<tr>元素
mycurrent_row = document.createElement("tr");
for(var i = 0; i < 2; i++) {
// 创建一个<td>元素
mycurrent_cell = document.createElement("td");
//创建一个文本节点
currenttext = document.createTextNode("单元格是第"+j+"行，第"+i+"列");
// 将创建的文本节点添加到<td>里
mycurrent_cell.appendChild(currenttext);
// 将列<td>添加到行<tr>
mycurrent_row.appendChild(mycurrent_cell);
}
// 将行<tr>添加到<tbody>
mytablebody.appendChild(mycurrent_row);
}
// 将<tbody>添加到<table>
mytable.appendChild(mytablebody);
//将<table>添加到<body>
mybody.appendChild(mytable);
// 将表格mytable的border属性设置为2
mytable.setAttribute("border", "1");
mytable.setAttribute("cellSpacing", "1");
mytable.onclick=function() {show(67);};
//mytable.setAttribute("onClick","show();");
mytablebody.id="gg";
}
function show(str)
{
id=document.getElementById("gg");
alert(str)
// 创建一个<tr>元素
mytr = document.createElement("tr");
//设置样式
mytr.setAttribute("style","text-align: center;background-color: #ff444f;");//FOR OTHER
mytr.style.cssText="text-align: center;background-color: #ff444f;";//FOR IE
// 创建一个<td>元素
mytd0 = document.createElement("td");
//创建一个文本节点
tdtext = document.createTextNode("单元格是第行，第列");
// 将创建的文本节点添加到<td>里
mytd0.appendChild(tdtext);
// 将列<td>添加到行<tr>
mytr.appendChild(mytd0);
mytd1 = document.createElement("td");
mytd1.innerHTML=" <select name='select' id='selectid'><option value ='手动' selected='selected'>手动</option><option value='自动 ' selected='selected'>自动</option></select> <input type ='text' name='money' value='' size='5' id='money'><span id='urlmoney'> <a href=javascript:shouweijia('5445') class=editad>首位价</a> </span>";
mytr.appendChild(mytd1);
// 将行<tr>添加到<tbody>
id.appendChild(mytr);
}
<script>
var mybody = document.getElementsByTagName("body" ) [0];
mytable.onload=function() {show(start();};
</script>
相关阅读:
- 网站设计者必备的20个FireFox扩展 (17xrj, 2008-2-10)
- win2003自动登陆 (sany, 2007-4-19)
导入论坛 引用链接 收藏 分享给好友 推荐到圈子 管理 举报
