4.4
疫情中逝去的每一个生命，都不只是一个简单的数字或名字。他们是父亲、母亲、儿女、兄妹，是我们血脉相连的骨肉同胞。我们向逝世同胞致哀，同时也向那些与死神不屈抗争的生命致敬，向那种生死瞬间的人间大爱致礼。
使用js实现后台商品列表中的全选和反选效果
y：自我介绍一下，我，高冷的女学霸。
w：就这？
y(高冷不说话)
w：害，那为什么删掉我？
y：你不是要把早起这种美妙的感觉告诉全世界的人么？
w：？？？
y：我是一个高冷的神！！！
w：我可以说我错了么？
y(没反应)
w：我深刻认识到自己错了！！！
y(没反应)
w：呃呃呃，有些尴尬。害，言归正传，全选和反选的效果用图片是没法展示出来的，但是预览一下有错么？
shoplist.html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>餐饮列表页面-后台管理</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/list.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="place"> <span>位置：</span>
<ul class="placeul">
<li><a href="main.html">首页</a></li>
<li><a href="#">购物后台管理</a></li>
<li><a href="#">商品列表</a></li>
</ul>
<div class="date_text"><img src="images/leftico04.png"> 今天是2015年2月10日 星期一 12：00</div>
</div>
<div class="rightinfo">
<div class="tools">
<ul class="toolbar">
<li ><span><img src="images/t01.png" /></span>添加</li>
<li ><span><img src="images/t02.png" /></span>修改</li>
<li class="click"><span><img src="images/t03.png" /></span>删除</li>
<li><a href="jqueryChart.html"><span><img src="images/t04.png" /></span>统计</a></li>
<li><span><img src="images/t05.png" /></span>设置</li>
</ul>
<iframe src="shop_search.html" scrolling="no" frameborder="0" width="400" height="42"></iframe>
</div>
<table class="tablelist">
<thead>
<tr>
<th><input name="checkAll" type="checkbox" id="checkAll" onchange="selectAll()"/>全选/
<input name="checkOther" type="checkbox" id="checkOther" onchange="selectOther()"/>反选
</th>
<th>缩略图</th>
<th>商品名称</th>
<th>商品类别</th>
<th>数量(件）</th>
<th>单价（元）</th>
<th>发布时间</th>
<th>是否审核</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td><input name="checkItem" type="checkbox" value="" /></td>
<td class="imgtd"><img src="images/img06.png" /></td>
<td>RAX头层牛皮户外鞋 男防滑登山鞋</td>
<td>运动</td>
<td>334</td>
<td>¥566.00</td>
<td>2015-06-06</td>
<td>已审核</td>
<td><a href="#" class="tablelink">查看</a>
<a href="#" class="tablelink"> 删除</a></td>
</tr>
<tr class="odd">
<td><input name="checkItem" type="checkbox" value="" /></td>
<td class="imgtd"><img src="images/img07.png" /></td>
<td>七匹狼休闲裤春夏新款男士时尚裤</td>
<td>男装</td>
<td>455</td>
<td>¥236.00</td>
<td>2015-06-08</td>
<td>未审核</td>
<td><a href="#" class="tablelink">查看</a>
<a href="#" class="tablelink">删除</a></td>
</tr>
<tr>
<td><input name="checkItem" type="checkbox" value="" /></td>
<td class="imgtd"><img src="images/img08.png" /></td>
<td>欧美大牌五分袖收腰显瘦睫毛蕾丝 </td>
<td>女装</td>
<td>899</td>
<td>¥136.00</td>
<td>2015-06-07</td>
<td>未审核</td>
<td><a href="#" class="tablelink">查看</a>
<a href="#" class="tablelink">删除</a></td>
</tr>
<tr class="odd">
<td><input name="checkItem" type="checkbox" value="" /></td>
<td class="imgtd"><img src="images/img09.png" /></td>
<td>锐步REEBOK热2015新款</td>
<td>运动</td>
<td>3456</td>
<td>¥346.00</td>
<td>2015-06-06</td>
<td>已审核</td>
<td><a href="#" class="tablelink">查看</a>
<a href="#" class="tablelink">删除</a></td>
</tr>
<tr>
<td><input name="checkItem" type="checkbox" value="" /></td>
<td class="imgtd"><img src="images/img10.png" /></td>
<td>新款中大童荷叶边短袖裙子韩版</td>
<td>童装</td>
<td>678</td>
<td>¥316.00</td>
<td>2015-06-05</td>
<td>已审核</td>
<td><a href="#" class="tablelink">查看</a>
<a href="#" class="tablelink">删除</a></td>
</tr>
</tbody>
</table>
<script type="text/javascript">
//全选或全不选
function selectAll(){
var items=document.getElementsByName("checkItem");
var checkAll=document.getElementById("checkAll");
var checkOther=document.getElementById("checkOther");
checkOther.checked=false;
for(var i=0;i<items.length;i++){
items[i].checked=checkAll.checked;
}
}
//反选
function selectOther(){
var items=document.getElementsByName("checkItem");
var checkAll=document.getElementById("checkAll");
var checkOther=document.getElementById("checkOther");
checkAll.checked=false;
for(var i=0;i<items.length;i++){
items[i].checked=!items[i].checked;
}
}
</script>
<div class="pagin">
<div class="message">共<i class="blue">1256</i>条记录，当前显示第 <i class="blue">2 </i>页</div>
<ul class="paginList">
<li class="paginItem"><a href="#"><span class="pagepre"></span></a></li>
<li class="paginItem"><a href="#">1</a></li>
<li class="paginItem current"><a href="#">2</a></li>
<li class="paginItem"><a href="#">3</a></li>
<li class="paginItem"><a href="#">4</a></li>
<li class="paginItem"><a href="#">5</a></li>
<li class="paginItem more"><a href="#">...</a></li>
<li class="paginItem"><a href="#">10</a></li>
<li class="paginItem"><a href="#"><span class="pagenxt"></span></a></li>
</ul>
</div>
</div>
</body>
</html>
w：两个css文件(layout.css，list.css)之前出的博客里有，链接：https://blog.csdn.net/weixin_43912621/article/details/105158837.
y：懒？
w：哦，对了，还有一个小小html：
shop_search.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>商品检索</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/list.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ul class="seachform">
<li>
<div class="vocation">
<select class="select3">
<option>商品类别</option>
<option>女装</option>
<option>男装</option>
<option>童装</option>
<option>运动</option>
</select>
</div>
</li>
<li>
<input type="text" class="scinput" value="请输入商品名称"/>
</li>
<li>
<input name="searchBtn" type="button" class="scbtn" value="查询"/>
</li>
</ul>
</body>
</html>
y：就这？
w：害，加我养个草？
y(高冷不说话)
w：今天你对我爱理不理，明天······
y：？？？
w：明天8~18度，多云，南风4-5级，注意保暖，不要着凉。
