javascript如何動態載入表格與動態新增表格行_javascript技巧

一、動態載入表格

1.首先在html中為表格的新增位置設定id

也就是在html的body標籤內部寫一個div標籤表示表格要新增到此div的內部。如下

2.在javascript中寫新增表格的語句

若在目前html檔中，則寫在<script>標籤內部，如<BR><div class="codetitle"><span><a style="CURSOR: pointer" data="74836" class="copybut" id="copybut74836" onclick="doCopy('code74836')"><U>複製程式碼 程式碼如下:</script>

若是透過引入js文件，則在js檔案（假設是test.js）中直接寫出下列語句

複製程式碼 程式碼如下:

document.getElementById("tbl").inin >"

然後再引入自己的html檔案

複製程式碼 程式碼如下:

二、動態新增表格行

1.首先在html中為表格行的新增位置設定id，此位置必須是內部（不是特別準確，但根據我的測試就得到此結論，有其他的方法請留言，謝謝），如下

複製程式碼 程式碼如下:

//tfoot與thead是與tbody搭配使用，但我寫的時候，沒用也可以。




[sS ]*n
2.在javascript內容中，要先建立行和儲存格，再在<.tbody>中加入行，如下
[code]
row=document.createElement("tr"); //建立行

td1=document.createElement ("tr"); //建立儲存格

td1.appendChild(document.createTextNode("content")); //為儲存格新增內容

row.appendChild(td1) ; //將儲存格加入行內

document.getElementById("rows").append(row); //將行加入中


三、我的小發現（也許別人早知道了、、、）

1. 我自己做了測試，html中寫"，這樣寫了之後進行測試，html中table的行不會添加。 >2.做完上面的測試，我又改了一下html中寫

content",測試可以新增內容。

3.思考：從上面兩個測驗似乎可以得到什麼結論，該如何總結還沒想好，哪樣的標籤可以直接透過innerHTML直接加入呢？