老师代码还有什么需要改进的吗？
来源：2-4 编程练习
原来是晓琪_
2020-01-07 13:33:55
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>模版字符串</title>
</head>
<body>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
<script type="text/javascript">
const tmpl = function() {
return {
title: "前端",
data: [{
title: '布局基础',
date: ["html", "css"]
}, {
title: '网页特效',
date: ["javascript", "jquery"]
}, {
title: '框架',
date: ["bootstrap", "vue"]
}]
}
}
// 补充代码
const { title: tableCaption, data: tableData } = tmpl();
let arr = [];
tableData.forEach(function({ title, date }){
arr.push(
`
<tr>
<td style="border: 1px solid #000">${ title }</td>
<td style="border: 1px solid #000">${ date[0] }</td>
<td style="border: 1px solid #000">${ date[1] }</td>
</tr>
`
)
})
let table = document.createElement('table');
let div = document.createElement('div');
div.innerHTML = tableCaption;
div.style.width = '211px';
div.style.textAlign = 'center';
document.body.appendChild(div);
table.innerHTML = arr.join('');
table.style.border = '1px solid #000';
document.body.appendChild(table);
</script>
</body>
</html>
样式好像不可以合写？像这样
xxx.style = {
width: '211px',
color: 'red'
}
1回答
-
同学你好，代码实现效果正确，很棒！
优化：表格的边框可以添加在table自有的border属性上，这样单元格就不需要设置边框了；表格有标题标签caption，不需要另写一个div了。参考：
另外，js中style属性后面直接写样式名称，不能字面量形式{}添加多个样式。
如果我的回答帮助到了你，欢迎采纳，祝学习愉快~
0
相似问题
回答 2
回答 1
回答 1
回答 1
回答 1