<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
table,th,tr,td{border: blue 1px solid;border-collapse: collapse;}
table{width: 50%}
</style>
</head>
<body>
<h3>购物车</h3>
<table id="tb">
<thead>
<th>id</th>
<th>名称</th>
<th>分类</th>
<th>库存</th>
<th>操作</th>
</thead>
<tbody>
</tbody>
</table>
<script>
// 数组
var arr=[
{id:1,name:'苹果',cate:'ios手机',count:10},
{id:2,name:'华为',cate:'安卓手机',count:15},
{id:3,name:'诺基亚',cate:'塞班手机',count:5},
];
var obj=document.getElementById('tb').tBodies[0];
for(var i=0;i<arr.length;i++){
var tr=document.createElement('tr');
tr.innerHTML="<td>"+arr[i].id+"</td>";
tr.innerHTML +="<td>"+arr[i].name+"</td>";
tr.innerHTML +="<td>"+arr[i].cate+"</td>";
tr.innerHTML +="<td>"+arr[i].count+"</td>";
tr.innerHTML +="<td><span onclick='del(this)'> 删除</span>/查看</td>";
obj.appendChild(tr);
}
function del(e){
if(confirm('确定删除?')){
var tr_del=e.parentNode.parentNode;
tr_del.parentNode.removeChild(tr_del);
}
return false;
}
</script>
</body>
</html>
