HTML5 使用JQuery对表格进行增加列操作

最新推荐文章于 2021-06-20 03:16:08 发布

阿紫.

最新推荐文章于 2021-06-20 03:16:08 发布

阅读量3.3k

点赞数 5

分类专栏： HTML 文章标签： HTML5 JQuery 表格

本文链接：https://blog.csdn.net/weixin_42303681/article/details/90552959

版权

HTML5 使用JQuery对表格进行操作

1.设计数据表格页面；
2增加一列“平均成绩”，显示每个学生的三门课的平均成绩，保留一位小数点；
3.把身为党员，且平均成绩>87分的女同学数据行使用红色背景标注。

style样式代码:

<style>
			table {
    
				text-align: center;/*文本居中，即表格中的文字内容居中*/
				margin: auto;/*将整个表格居中*/
				border-collapse: collapse;/*合并边框线用*/
				/*cellspacing为单元格之间的距离，当值为0时，使距离为0单不会合并边框线*/
				height: 300px;
				width: 600px;
			}
		</style>

主体部分代码:

<body>
		<table border="1"><!--有边框，无边框时赋值为0-->
			<tr style="background-color: lightgrey;">
				<th>学号</th>
				<th>姓名</th>
				<th>性别</th>
				<th>党员</th>
				<th>高等数学</th>
				<th>大学英语</th>
				<th>计算机文化基础</th>
			</tr>

			<tr>
				<td>13310320712</td>
				<td>陈中华</td>
				<td>男</td>
				<td>