1、先新建一个html文件,命名为test.html。
2、在test.html文件内,使用div标签创建一个模块,并设置其id为outinput,主要用于下面通过该id获得div对象。
3、在js标签内,定义一个数组arr,数组内定义三个元素,分别为“测试一”,“测试二”,“测试三”。
4、在js标签内,通过length属性获得数组arr的长度,即元素的个数,主要用于for语句中限制循环的次数。
5、在js标签内,定义一个变量html,使用for循环遍历arr数组,每次读取数组元素,将元素值与p标签组合,用于实现在页面出来。
6、在js标签内,使用getElementById()方法通过id(outinput)获得div对象,通过innerHMTL属性将html变量输出在页面div标签中,从而实现取出数组值并显示出来。
7、最后在浏览器打开test.html文件,查看实现的效果,就完成了。
下拉框select
每一个选项是option
显示值是<option>显示值</option>
实际值是value,<option value="实际值">显示值</otpion>
默认选中是selected
下面是一个简单的例子:
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
let select = document.createElement("select")
let option1 = document.createElement("option")
option1.setAttribute("value","1")
option1.innerText = "张三"
select.appendChild(option1)
let option2 = document.createElement("option")
option2.setAttribute("value","2")
option2.innerText = "李四"
option2.setAttribute("selected","")
select.appendChild(option2)
document.body.appendChild(select)
</script>
</body>
</html>
效果: