JS(dom)如何自动的生成表格

JavaScript019

JS(dom)如何自动的生成表格,第1张

交你一个完整的:

例子:

<script>

function checkname(){

var name=document.getElementById("uname").value

var mydiv=document.getElementById("myDiv")

mydiv.innerHTML=""

if(name.length==0){

mydiv.innerHTML="<font color=red>用户名不能为空</font>"

}

}

</script>

<body>

<form>

<table>

<tr><td>用户名:<input type="text" id="uname" onblur="checkname()"><div style="display:inline" id="myDiv"></div> </td></tr> //display里面的属性设置为inline就是设置信息与你的文本框在同一行显示,还可以设置为block就换行显示出来。文本框的失去焦点事件:onblur 当你鼠标焦点离开文本框就提示你还未输入!

</table>

</form>

//////////////////////////其他的照葫芦票 多几个else if就可以了 不同的情况给与不同的提示也就是更换div的innerHTML中的内容、、、、、、、、、、、、、、、、

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

通过动态创建table,tr,td的方式进行表格创建

function autocreate(){

//创建table表格

var table=document.createElement("table")

table.setAttribute("border","1")

table.setAttribute("background","red")

//获取行数值

var line=document.getElementById("line").value

//获取列数值

var list=document.getElementById("list").value

for(var i=1i<=linei++){

//alert(line)

//创建tr

var tr=document.createElement("tr")

for(var j=1j<=listj++){

//alert(list)

//创建td

var td=document.createElement("td")

td.innerHTML=i*j

tr.appendChild(td)

}

table.appendChild(tr)

}

document.getElementById("d1").appendChild(table)

}