HTML有时会写大概相同的超多div,费时费力。在这里记一下使用js实现的小技巧。
直接上代码:
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>/*使用js不要忘记在head中加入标签来支持jquery(更方便)*/
<script>/*div基本上是一样的,一个一个写太浪费时间。于是有js来完成所有div的实现*/
/*样式也得在这里完成,在css文件中或是在头中都不好完成css样式的循环*/
for (var i=-70;i<=100;i++){
a='<div style="';
/*Math.round(N) 对N数进行取整
Math.random() 是产生一个随机数*/
a+="background-color: rgb("+Math.round(Math.random()*255)+","+Math.round(Math.random()*255)+","+Math.round(Math.random()*255)+");";
a+='">';
a+=i;
a+='</div>';
/*$(".stage") 是jquery选择到一个class为stage的元素
append是将我们a添加到他的子节点(子元素)中 */
$(".stage").append(a);
}
</script>