js 如何 table 如何設置某一列列寬

若何用js設置table某一列列寬？有時，我們在編寫網頁時，需要動態改變table的列寬，具體應該若何操作呢？下面，小編就來為大師介紹一下用js設置table某一列列寬的方式。

方式/步調

1
起首，新建一個測試網頁，網頁中本家兒要添加有可視控件表格<table>和按鈕<button>。
2
想心猿意馬：我們要實現點擊<button>，改變表格的第二列的寬為300px。
起首，我們給表格第二列的<th><td>控件，添加一個css樣式：class="oldWidth"
3
然后在<head>標簽對中，界說兩個樣式：oldWidth、newWidth的具體內容，現實中大師按照需要界說，這里各只界說了一個寬度屬性，別離是最初寬度和改變后的寬度。
4
然后，我們再來為<button>標簽添加onclick事務，響應函數名的addColWidth。
5
再在</body>標簽后，插手<script>標簽對，并編寫addColWidth()函數的實現代碼:起首，經由過程樣式名oldWidth獲取到所有應用該樣式的對象.
6
再經由過程for語句輪回，來為經由過程樣式名oldWidth獲得的所有對象，付與新的樣式newWidth，從而達到實現改變列寬的目標。
7
保留代碼后，在瀏覽器中打開，下面兩張圖就是按鈕點擊前后的對比結果，可以看到點竄表格列寬的方針當作功達到。