表格的DOM模型？

Question

<table id=showTable>
<thead><tr><td>head1</td><td>head2</td></tr></thead>
<tbody><tr><td>OK</td><td>sf</td></tr></tbody>
<sdf><tr><td>ikhk</td><td>sdf</td></tr></sdf>
</table>
<input type=button value=show onclick=alert(getObj(showTable,"thead").innerHTML)>
<script>
function getObj(obj,TagName){
return obj.getElementsByTagName(TagName)[0]
}
</script>

Answer 1

<table id=showTable>
<thead><tr><td>head1</td><td>head2</td></tr></thead>
<tbody><tr><td>OK</td><td>sf</td></tr></tbody>
<sdf><tr><td>ikhk</td><td>sdf</td></tr></sdf>
</table>
<input type=button value=search onclick=alert(searchObj(showTable,"sdf").innerHTML)>
<script>
function searchObj(obj,words){
var objs=obj.cells;
for(var i=0;i<objs.length;i++){
if(objs[i].innerText.indexOf(words)!=-1) return(objs[i]);
}
}
</script>

Answer 2

可以用 showTable.firstChild或者showTable.childNodes[0]取得thead
showTable.childNodes[1]取得tbody另外对于自定义标签，如果没有指定xmlns,ie是不认的
比如：
<sdf><hr></sdf>
这里：ie把它看为3个单独的tag,而不是我们想象的两个
<sdf>和</sdf>是两个完全不同的tag看代码
<table id=showTable>
<thead><tr><td>head1</td><td>head2</td></tr></thead>
<tbody><tr><td>OK</td><td>sf</td></tr></tbody>
<sdf><tr><td>ikhk</td><td>sdf</td></tr></sdf>
</table>
<input type=button value=show onclick=alert(showTable.firstChild.innerHTML)>
<input type=button value=show2 onclick=alert(showTable.childNodes[0].innerHTML)>
<input type=button value="get(<sdf>)" onclick=alert(getsdf())>
<input type=button value="get(</sdf>)" onclick=alert(getsdf2())><script>
function getsdf(){
return showTable.getElementsByTagName("sdf")[0].outerHTML
}
function getsdf2(){
return showTable.getElementsByTagName("/sdf")[0].outerHTML
}
</script>