javascript js 刪除表格的行、單元列

來源:互聯網
上載者:User

動態刪除表格的行、列,有點類似於String中的substring函數。不過這裡也有開始刪除的位置和刪除的長度。但是不包括起始位置,用法和substring類似;</p><p><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><br /><html><br /><head><br /><title>tab2.html</title><br /><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><br /><meta http-equiv="description" content="this is my page"><br /><meta http-equiv="content-type" content="text/html; charset=UTF-8"><br /><script type="text/javascript"><br /> //刪除table列:從start列開始刪除,共刪end列(不包括start)<br /> function removeCells(tab, start, end) {<br /> var rows = tab.rows;<br /> for (var i = 0; i < rows.length; i++) {<br /> var cells = rows[i].cells;<br /> /*for (var j = 0; j < cells.length; j++) {<br /> if (j >= start && j <= end) {<br />tab.rows[i].deleteCell(start);<br /> }<br /> }*/<br /> for (var j = 0; j < end; j++) {<br />tab.rows[i].deleteCell(start);<br /> }<br /> }<br /> }<br /> //刪除table行,從start行開始刪除,共刪end行(不包括start)<br /> function removeRows(tab, start, end) {<br /> var rows = tab.rows;<br /> /*for (var i = 0; i < rows.length; i++) {<br /> if (i >= start && i <= end) {<br /> tab.deleteRow(start);<br /> }<br /> }*/<br /> for (var i = 0; i < end; i++) {<br /> tab.deleteRow(start);<br /> }<br /> }</p><p> function deleteCells() {<br /> var tab = document.getElementById("tab");<br /> var start = document.getElementById("startCell").value;<br /> var end = document.getElementById("endCell").value;<br /> if (tab.rows.length > 0) {<br /> var cell = tab.rows[0].cells;<br /> start = start > cell.length ? cell.length : start;<br /> start = start < 0 ? 0 : start;<br /> end = end > cell.length ? cell.length : end;<br /> end = end < 0 ? 0 : end;<br /> }<br /> removeCells(tab, start, end);<br /> }</p><p> function deleteRows() {<br /> var tab = document.getElementById("tab");<br /> var start = document.getElementById("startRow").value;<br /> var end = document.getElementById("endRow").value;<br /> start = start > tab.rows.length ? tab.rows.length : start;<br /> start = start < 0 ? 0 : start;<br /> end = end > tab.rows.length ? tab.rows.length : end;<br /> end = end < 0 ? 0 : end;<br /> removeRows(tab, start, end);<br /> }</p><p> window.onload = function () {<br /> var showDiv = document.getElementById("show");<br /> var htmlTemplate = "<table id='tab' border='1'>";<br /> for (var i = 0; i < 4; i++) {<br /> htmlTemplate += "<tr>";<br /> for (var j = 0; j < 13; j++) {<br /> htmlTemplate += "<td>" + i + "-" + j + "</td>";<br /> }<br /> htmlTemplate += "</tr>";<br /> }<br /> htmlTemplate += "</table>";<br /> showDiv.innerHTML = htmlTemplate;<br /> }<br /> </script><br /></head><br /><body><br /><input type="text" id="startCell" /><br /><input type="text" id="endCell" /><br /><input type="button" value="刪除列" onclick="deleteCells()"><br/><br /><input type="text" id="startRow" /><br /><input type="text" id="endRow" /><br /><input type="button" value="刪除行" onclick="deleteRows()"><br /><div id="show"></div><br /></body><br /></html><br />

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.