首頁 > 網際網路

js中如何給HTML的表格一行行的賦值

2019-12-12 00:56:34

在頁面開發中,我們經常會使用到JS來處理前端邏輯,那麼你知道怎麼使用JS給html表格賦值嗎?下面我們就來看一下。

1

為了方便對html dom的操作,我們使用jquery來操作,所以先引入對應指令碼檔案。


2

html裡,建立一個table,表裡的資料為空。再建立一個按鈕,來觸發資料填充。


3

建立一個js方法,來響應按鈕點選的事件,方法裡先建立一個陣列,用來存放填充表格的資料。


4

通過jquery方法來獲取table的tr行。然後用一個for迴圈來回圈填充每一行的資料。


5

再通過jquery的find方法,來找到每一行的td表單元格。


6

按順序來填充每一個單元格的資料,td[0]就是第一個單元格,用資料的id來填充,td[1]用value來填充。


7

執行頁面,我們可以看到現在的表格是沒有資料的,點選下方的按鈕。


8

點選後,我們就順利填充到對應的資料了。



IT145.com E-mail:sddin#qq.com