js实现课堂点名案例
style样式
.cor {
background-color: #6083cd;
}
#box {
width: 500px;
border: 2px solid black;
margin: 0 auto;
height: 500px;
}
ul {
list-style: none;
}
li {
width: 50px;
height: 50px;
margin: 20px;
float: left;
line-height: 50px;
text-align: center;
}
.center {
width: 156px;
height: 40px;
line-height: 40px;
margin: 0 auto;
}
#pp {
display: block;
text-align: center;
margin-top: 40px;
font-size: 35px;
}
body排列
点名系统
js代码
function my$(id){
return document.getElementById(id);
}
//定义数组,存放数值
var arr = ["卓子贤","梁图","袁绍思","张家磊","梁文龙","方志豪","曾勇强","陈文"];
//先创建一个ul加入到名字为dv的div中
var oul = document.createElement("ul");
my$("dv").appendChild(oul);
//接下来遍历arr数组,动态创建li元素并且加入到ul中,并且把数组变量动态写到li中
for(var i=0;i
关注
打赏
最近更新
- 深拷贝和浅拷贝的区别(重点)
- 【Vue】走进Vue框架世界
- 【云服务器】项目部署—搭建网站—vue电商后台管理系统
- 【React介绍】 一文带你深入React
- 【React】React组件实例的三大属性之state,props,refs(你学废了吗)
- 【脚手架VueCLI】从零开始,创建一个VUE项目
- 【React】深入理解React组件生命周期----图文详解(含代码)
- 【React】DOM的Diffing算法是什么?以及DOM中key的作用----经典面试题
- 【React】1_使用React脚手架创建项目步骤--------详解(含项目结构说明)
- 【React】2_如何使用react脚手架写一个简单的页面?