js操作表格I

最新推荐文章于 2023-07-28 10:02:57 发布

道法—自然

最新推荐文章于 2023-07-28 10:02:57 发布

阅读量155

点赞数 1

分类专栏：前端页面

本文链接：https://blog.csdn.net/wyqwilliam/article/details/103542991

版权

<html> <head> <title>js操作表格</title> <meta charset="UTF-8"/>  <style type="text/css"> table{ margin: auto; margin-top: 20px...

摘要由CSDN通过智能技术生成

<html>
	<head>
		<title>js操作表格</title>
		<meta charset="UTF-8"/>
		<!--声明css代码域-->
		<style type="text/css">
			table{
				margin: auto;
				margin-top: 20px;
			}
			tr{
				height: 40px;
			}
		</style>
		<!--声明js代码域-->
		<script type="text/javascript">
			//实现修改功能
				function updateCount(btn){
					//获取要修改的td元素对象
						//获取要修改内容所在的行对象
						var tr=btn.parentNode.parentNode;
						//获取该行下的所有单元格对象数组
						var cs=tr.cells;
						//获取要修改的单元格对象
						var td=cs[3];
					//修改单元格内容为文本框
						if(!isNaN(td.innerHTML)){
							
						td.innerHTML="<input type='text' value='"+td.innerHTML+"' onblur='saveCount(this)' />";
						}
				}
			//保存数据
				function saveCount(inp){
					//获取要修改的单元格对象
					var td=inp.parentNode;
					//修改数量
					td.innerHTML=inp.value;
				}
			//删除行
				function delRow(btn){
					if(window.confirm("你确定要删除吗?")){
						//获取要删除的行
						var tr=btn.parentNode.parentNode;
						//获取表格对象
						var ta=document.getElementById("ta");
						//删除行,注意获取当前行的角标。
						ta.deleteRow(tr.rowIndex);
					}
				}
		/*---------------------js操作多选框--------------------------------------*/
			//全选
				function chooseAll(){
					//获取全选的checkbox对象
					var ch=document.getElementById("ck");
					//获取所有的che

最低0.47元/天解锁文章

道法—自然

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js操作表格I

<html> <head> <title>js操作表格</title> <meta charset="UTF-8"/>  <style type="text/css"> table{ margin: auto; margin-top: 20px...
复制链接

扫一扫