<body>
<table cellspacing="0">
<thead>
<tr>
<th>角色</th>
<th>法术</th>
<th>法力</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<td></td>
</tbody>
</table>
<script>
var datas = [{
name: '闻人翊悬',
magic: '火系',
mana: 85
}, {
name: '申屠子夜',
magic: '水系',
mana: 80
}, {
name: '公仪楚人',
magic: '土系',
mana: 85
}, {
name: '容成墨熙',
magic: '木系',
mana: 90
}, {
name: '轩辕神君',
magic: '金系',
mana: 100
}, {
name: '小新',
magic: '童系',
mana: 100
}];
var tbody =document.querySelector('tbody');
for (var i=0;i<datas.length;i++){
var tr =document.createElement('tr');
tbody.appendChild(tr);
for (var k in datas[i]){
var td =document.createElement('td');
td.innerHTML=datas[i][k];
tr.appendChild(td);
}
var td =document.createElement('td');
td.innerHTML = '<a href="JavaScript:;">删除</a>';
tr.appendChild(td);
var as=document.querySelectorAll('a');
for (var i=0;i<as.length;i++){
as[i].onclick=function(){
tbody.removeChild(this.parentNode.parentNode);
}
}
}
</script>
</body>
这篇博客展示了不同角色的法术与法力值,包括闻人翊悬的火系法术,申屠子夜的水系法术,公仪楚人的土系法术,容成墨熙的木系法术,轩辕神君的金系法术,以及小新的童系法术。每个角色的法力值从80到100不等,提供了一个简单的操作界面,允许用户删除角色条目。
1327

被折叠的 条评论
为什么被折叠?



