ieとfirefoxでtableオブジェクトを操作する異同

2183 ワード

ieとfirefoxでtableオブジェクトを操作する異同【テストブラウザバージョン:ieは6、firefoxは2.0】
1)ieの下でtableタグはappendChildを直接使用してdocumentを増加する.createElement('tr')の行は表示されませんが、firefoxでは問題ありません.次のように
<table id="table1" border='1'></table>

<script type='text/javascript'>

var tb=document.getElementById('table1');

var tr=document.createElement('tr'),td=document.createElement('td');

td.innerHTML=new Date();

tr.appendChild(td);// 

tb.appendChild(tr);// 

</script> 


上のコードを実行したら、説明と同じでしょう.
解決策はtableタグ内にtbodyタグを追加し、tbodyがappendChildを使用する場合ieとfirefoxで表示できるようにすることです.
<table border='1'><tbody id="tbody1"></tbody></table>

<script type='text/javascript'>

var tb=document.getElementById('tbody1');

var tr=document.createElement('tr'),td=document.createElement('td');

td.innerHTML=new Date();

tr.appendChild(td);// 

tb.appendChild(tr);// 

</script> 


 
 
2)
InsertRowとinsertCellを使用して行とセルを挿入する場合は、ieの下で行番号と列番号を渡さないことに注意してくださいが、firefoxの下では、エラーが発生しないように渡さなければなりません.【insertRowとinsertCellはtableタグでもtbodyタグでもどちらでも使用可能】
 
<table id="table2" border='1'></table>

<script type='text/javascript'>

var tb=document.getElementById('table2');

var tr=tb.insertRow(),td=tr.insertCell();

td.innerHTML=new Date();

</script> 


 
上のコードを実行するとieの下に行とセルを挿入できますが、firefoxの下に「uncaught exception:[Exception...「Not enough arguments」nsresult:「0 x 80570001(NS_ERROR_XPC_NOT_ENOUGH_ARGS)」location:「JS frame::file:///E:/IISDebug/ajax/table.htm::::line 32「data:no」のエラー
解決策は、行番号と列番号をパラメータとして入力することです.
ただし、2行ある場合は2行を渡すことができますが、3を渡すことはできません.強いタイプの言語の配列のように、境界を越えてはいけない.
<table id="table3" border='1'></table>

<script type='text/javascript'>

var tb=document.getElementById('table3');

var tr=tb.insertRow(tb.rows.length)// , , 

  ,td=tr.insertCell(0);

td.innerHTML=new Date();

</script>