使用 JS 對 table 對象增加/刪除行、列

一：增加行、列

增加行

        // quTableObj是一個table對象
        var quTableObj=quItemBody.find(".quCoItem table.quCoChenTable");
		// 行數
		var rowNum = quTableObj[0].rows.length;
		// 列數
		var colNum = quTableObj[0].rows[0].cells.length;
		// 插入行，注意！此處不能放入循環中，否則會循環增加行
		var newRow= quTableObj[0].insertRow(rowNum);
		// 增加行，循環列添加單元格
		for(var i=0;i<colNum;i++){
			if(i == 0){
				newRow.insertCell(0).innerHTML="增加行";
			}else{
				// 依次向每一行的末尾插入一個新列
				newRow.insertCell(i).innerHTML="1";
			}
		}

增加列

        // 增加列，此處quTableObj是一個table對象
		var quTableObj=quItemBody.find(".quCoItem table.quCoChenTable");
		// 行數
		var rowNum = quTableObj[0].rows.length;
		// 列數
		var colNum = quTableObj[0].rows[0].cells.length;
		// 增加列，循環行添加單元格
		for(var i=0;i<rowNum;i++){
			if(i == 0){
                // 此處增加單元格可以放入循環中
				var content = quTableObj[0].rows[i].insertCell(colNum);
				content.innerHTML="22";
			}else{
				// 依次向每一行的末尾插入一個新列
				var content=quTableObj[0].rows[i].insertCell(colNum);
				content.innerHTML="2";
			}
		}

quTableObj內容

二：再更新一下刪除行列的方法：

刪除行很簡單，只需要獲取到當前選中單元格的父（ tr )，使用行的remove()方法就可以了

optionParent.remove();

optionParent是 tr 對象

刪除列需要做幾步：

1：獲取當前單元格第幾列

2：獲取一共多少行（循環刪除時用）

3：遍歷刪除

            var index=$(curEditObj).parents()[0].cellIndex;
			var len = quCoChenTable[0].rows.length; 
		    for(var i = 0;i < len;i++){
		    	quCoChenTable[0].rows[i].deleteCell(index);
		    }

其中quCoChenTable是table對象，table.rows[i].deleteCell[j] 即 刪除第 i 行 第 j 列的單元格