JS对table的add,del,modify操作

function Style() { var Style = document.getElementById('Style'); Style.disabled = true; var tr = document.getElementById('cell'); if (tr.rows[0] != null) { var td = tr.rows[0].cells[0]; td.style.backgroundColor = "#ffdddd"; } } function modify() { var modify = document.getElementById('modify'); modify.disabled = true; var tr = document.getElementById('cell'); if (tr.rows[0] != null) { tr.rows[0].cells[0].innerHTML = '冰箱'; } } function del() { var add = document.getElementById('add'); var del = document.getElementById('del'); var modify = document.getElementById('modify'); var Style = document.getElementById('Style'); add.disabled = false; del.disabled = true; modify.disabled = true; Style.disabled = true; var tr = document.getElementById('cell'); for (i = tr.rows.length - 1; i >= 0; i--) { tr.deleteRow(i); } } function add() { var add = document.getElementById('add'); var del = document.getElementById('del'); var modify = document.getElementById('modify'); var Style = document.getElementById('Style'); add.disabled = true del.disabled = false; modify.disabled = false; Style.disabled = false; var tr = document.getElementById('cell'); tr = tr.insertRow(tr.rows.length); var td = tr.insertCell(0); td.innerHTML = '空调'; }

<table id="cell"> <tr> <td> </td> </tr> </table> <input type="button" value="add" οnclick="add()" id="add" /> <input type="button" value="del" οnclick="del()" id="del" disabled="disabled" /> <input type="button" value="modify" οnclick="modify()" id="modify" disabled="disabled" /> <input type="button" value="Style" οnclick="Style()" id="Style" disabled="disabled" /> <script type="text/javascript" src="table.js"> </script>