版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u011240016/article/details/84308985
这篇就是简单记录下一个小点：
设置好CSS样式先，然后动态生成元素，元素可以按照CSS样式显示，只要对应到相应的规则即可。
<!DOCTYPE html>
<html>
<head>
<title>Grid Layout Test</title>
<style type="text/css">
.container {
display: grid | inline-grid;
}
#red {
color: red;
}
</style>
</head>
<body>
<div class="container">
<!-- <div id="red">Test</div> -->
</div>
<script type="text/javascript">
var container = document.getElementsByClassName('container'); // 返回一个数组
var test = document.createElement('p');
test.innerHTML = "HELLO WORLD";
container[0].appendChild(test); // 不能用数组添加子结点，而必须是单个元素
test.setAttribute('id', 'red');
</script>
</body>
</html>
这是为后面提前设定好布局，然后动态生成元素做一下铺垫。
END.