Javascript遍历Html Table示例(包括内容和属性值)
投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-07-08 我要评论
这篇文章主要介绍了Javascript如何遍历Html Table(包括内容和属性值),需要的朋友可以参考1: 遍历并输出Table中值
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<
table
id
=
"tb"
>
<
tr
>
<
td
></
td
>
</
tr
>
<
tr
>
<
td
></
td
>
</
tr
>
</
table
>
function f()
{
var t=document.getElementById("tb").childNodes.item(0);
for(var i=0;i< t.childNodes.length;i++)
{
for(var j=0;j<t.childNodes(i).childNodes.length;j++)
{
alert(t.childNodes(i).childNodes(j).innerText);
}
}
}
|
2: 遍历Table,读取CheckBox状态和其他Column值
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <
html
xmlns
=
"http://www.w3.org/1999/xhtml"
> <
head
> <
title
>Untitled Page</
title
> </
head
> <
body
onload
=
"f()"
>
<
script
type
=
"text/javascript"
>
function f()
{
var t=document.getElementById("tb").childNodes.item(0);
for(var i=0;i<
t.childNodes.length
;i++)
{
alert(t.childNodes(i).firstChild.firstChild.nodeValue);
alert(t.childNodes(i).childNodes[1].firstChild.checked);
}
}
</script>
<
table
id
=
"tb"
>
<
tr
>
<
td
style
=
"width: 122px"
>
1234</
td
>
<
td
style
=
"width: 89px"
>
<
input
type
=
"checkbox"
/></
td
>
<
td
style
=
"width: 210px"
>
</
td
>
</
tr
>
<
tr
>
<
td
style
=
"width: 122px; height: 21px"
>
2234</
td
>
<
td
style
=
"width: 89px; height: 21px"
>
<
input
type
=
"checkbox"
checked
=
"CHECKED"
/></
td
>
<
td
style
=
"width: 210px; height: 21px"
>
</
td
>
</
tr
>
<
tr
>
<
td
style
=
"width: 122px"
>
3234</
td
>
<
td
style
=
"width: 89px"
>
<
input
type
=
"checkbox"
/></
td
>
<
td
style
=
"width: 210px"
>
</
td
>
</
tr
>
</
table
>
</
body
>
</
html
>
|