首页 > 代码库 > Table Javasc DOM操作（2） 具体实例应用
Table Javasc DOM操作（2） 具体实例应用
最近在做一个动态生成所需输入条件的业务，在网上找相关的可以应用到这上面的内容，最后采用了网上大牛的Table DOM 操作。
效果图：
具体代码如下：(再次感谢大牛)
<!doctype html>
<!--
JS DOM TABLE 操作 原创
QQ:42149485
-->
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
body,input,tr,td,select{font-size:12px; font-family:tahoma;}
#TB {width:980px; background:#3c3c3c; }
#TB .TT {height:30px; background:#616161;}
#TB .TT:hover {height:30px; background:#616161;}
#TB .TT td {color:#FFF;font-weight:bold; text-align:center;}
#TB tr {height:30px; background:#eaeaea;}
#TB tr:hover {height:30px; background:#fadada;}
#TB tr td {text-align:center; color:#000;}
.select {width:99%; height:28px;}
</style>
<script type="text/javascript">
//Create TR
var nName = new Array("Tony","Mika","Neo","Oi","Kim","Park","Mr Lee","Tasky","Saco","Novel");
var nSex = new Array("男性","女性","保密");
var i = 1;
function CreateTB(){
var oTB = document.getElementById("TB");
var oTR = oTB.insertRow(oTB.rows.length);
var oTD1 = oTR.insertCell(0);
oTD1.innerHTML = "<input type='checkbox' name='ck'>";
var oTD2 = oTR.insertCell(1);
oTD2.innerHTML = "<div>" + nName[parseInt(Math.random()*10)] + "</div><center><input type='text' style='display:none; width:99%; height:22px; text-align:center;'></center>";
var oTD3 = oTR.insertCell(2);
oTD3.innerHTML = "<div>" + parseInt(Math.random()*50+15) + "</div><center><select name='age' class='select' style='display:none;'></select></center>";
var oTD4 = oTR.insertCell(3);
oTD4.innerHTML = "<div>" + nSex[parseInt(Math.random()*3)] + "</div><center><select name='sex' class='select' style='display:none;'></select></center>";
var oTD5 = oTR.insertCell(4);
oTD5.innerHTML = "<input type='button' value=http://www.mamicode.com/'修改' onclick=/"edit(this,'show')/">";>
Table Javasc DOM操作（2） 具体实例应用
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。