您好,欢迎访问一九零五行业门户网

javascript怎么删除html

javascript删除html的方法:1、通过removechild删除节点;2、通过remove删除指定索引处的选项;3、通过deleterow和deletecell删除表格中的行和单元格。
本文操作环境:windows7系统、javascript1.8.5&&html5版,dell g3电脑
javascript 删除 html 元素
1-删除节点removechild(oldnode):删除 oldchild 子节点<body id="test"> <input id="add" type="button" value="增加" disabled onclick="add();"/> <input id="del" type="button" value="删除" onclick="del();"/> <p id="target" style="width:240px;height:50px;border:1px solid black"> 被控制的目标元素 </p> <script> var body = document.getelementbyid("test"); var target = document.getelementbyid("target"); var add = function(){ body.appendchild(target); document.getelementbyid("add").disabled="disabled"; document.getelementbyid("del").disabled=""; } var del = function(){ body.removechild(target); document.getelementbyid("del").disabled="disabled"; document.getelementbyid("add").disabled=""; } </script></body>
结果
1
2
2-删除列表框 下拉菜单的选项remove(long index):删除指定索引处的选项<body id="test"> <input id="opvalue" type="text" /> <input id="add" type="button" value="增加" onclick="add();"/> <input id="del" type="button" value="删除" onclick="del();"/> <select id="show" size="8" style="width:180px"></select> <script> var show = document.getelementbyid("show"); var add = function(){ var op = new option(document.getelementbyid('opvalue').value); show.options[show.options.length] = op; } var del = function(){ if (show.options.length>0){ show.remove(show.options.length-1); } } </script></body>
结果
3-删除表格的行或单元格deleterow(long index): 删除表格中 index 索引处的行deletecell(long index): 删除某行 index 索引处的单元格<body > <input id="delrow" type="button" value="删除表格最后一行" onclick="delrow();"/> <input id="delcell" type="button" value="删除最后一行最后一格" onclick="delcell();"/><br /> 删除第<input id="row" type="text" size="2" />行, 第<input id="cel" type="text" size="2" />列 <input id="chg" type="button" value="删除" onclick="change()"/> <table id="test" border="1" style="width:500px ;"> <caption> java</caption> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> <tr> <td>5</td> <td>6</td> </tr> </table> <script> var tab = document.getelementbyid("test"); var delrow = function(){ if (tab.rows.length >0){ tab.deleterow(tab.rows.length-1); } } var delcell = function(){ var rowlist = tab.rows; var lastrow = rowlist.item(rowlist.length-1); if (lastrow.cells.length >0){ lastrow.deletecell(lastrow.cells.length -1); } } var change = function(){ var tb = document.getelementbyid("test"); var row = document.getelementbyid('row').value; row = parseint(row); if (isnan(row)){ alert("请输入行整数"); return false; } var cel = document.getelementbyid('cel').value; cel = parseint(cel); if (isnan(cel)){ alert("请输入列整数"); return false; } if (row > tb.rows.length || cel> tb.rows[row-1].cells.length){ alert("要删除的不在"); return false; } tb.rows[row-1].deletecell(cel-1); } </script></body>
结果
推荐学习:《javascript高级教程》
以上就是javascript怎么删除html的详细内容。
其它类似信息

推荐信息