文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

javascript如何删除html

2023-06-15 04:06

关注

这篇文章将为大家详细讲解有关javascript如何删除html,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

javascript删除html的方法:1、通过removeChild删除节点;2、通过remove删除指定索引处的选项;3、通过deleteRow和deleteCell删除表格中的行和单元格。

本文操作环境:windows7系统、javascript1.8.5&&html5版,DELL G3电脑

JavaScript 删除 HTML 元素

1-删除节点

<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

2javascript如何删除html
javascript如何删除html

2-删除列表框 下拉菜单的选项

<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>

结果
javascript如何删除html

3-删除表格的行或单元格

<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如何删除html

javascript是一种什么语言

javascript是一种动态类型、弱类型的语言,基于对象和事件驱动并具有相对安全性并广泛用于客户端网页开发的脚本语言,同时也是一种广泛用于客户端Web开发的脚本语言。它主要用来给HTML网页添加动态功能,现在JavaScript也可被用于网络服务器,如Node.js。

关于“javascript如何删除html”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯