老师，除了样式有哪要改
来源：2-4 编程练习
Darkholme
2020-08-03 01:53:22
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>模版字符串</title>
<style type="text/css">
caption{
display: inline-block;
width: 15%;
text-align: center;
}
table{
border: 1px solid black;
}
td{
border: 1px solid black;
}
</style>
</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"]
}]
}
}
let show = function({title,data}){
let cap = document.createElement('caption');
var table = document.createElement('table');
cap.innerHTML = title;
data.forEach(function(arr) {
table.innerHTML += `<tr><td>${arr.title}</td><td>${arr.date[0]}</td><td>${arr.date[1]}</td></tr>`;
});
document.body.appendChild(cap);
document.body.appendChild(table);
}
show(tmpl());
</script>
</body>
</html>
我这么写有没有什么不规范之类的，哪怕一点我也想知道，我感觉我写的有点无脑
2回答
-
同学你好，对于你的问题解答如下：
因为每次循环使用innerHTML给table添加内容时，浏览器解析默认会在table下添加tbody标签。
因为word是变量，js语法中规定，放键名是变量时，需要使用中括号的形式获取到键值，即：map[word]
这个是经过调研的，一般一天的学习内容，10个问题是足够的。因为不能说，只看视频，这个是需要一个理解的过程的，学习之后，要慢慢消化。同时呢，要培养独立解决问题的能力，这个是以后工作中必不可少的。遇到问题可以先自己思考、查找资料等，先尝试自己解决，然后若不能解决，或者还是有不理解的内容再进行提问。
以后我们在工作中肯定会遇到各种各样的问题，我们没办法每一个都去找同事帮忙解决，所以独立解决问题的能力很重要，同学可以从现在开始就培养，提升自己各方面的能力，相信同学一定会变得更棒。
祝学习愉快~
1 -
好帮手慕慕子
2020-08-03
同学你好，按下F12键，打开控制台，页面结构如下所示，caption标签在table标签外了，且table标签下有多个tbody标签，不符合代码规范
建议修改：定义一个空字符串，循环时进行字符串拼接，循环结束后将table的innerHTML属性设置为字符串的拼接结果。
然后将标题追加到表格中
最后去掉标题的设置的样式
修改后的效果如下所示：
如果我的回答帮助到了你，欢迎采纳，祝学习愉快~
0h020-08-03
相似问题