7.DOM对列表下拉框元素的增删改操作
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>列表框,下拉菜单的增删改操作</title> <script type="text/javascript"> function createSelect(){ //创建 var select = document.createElement("select"); select.id = "city"; var body = document.getElementById("test"); body.appendChild(select); //创建五个option for(var i=1;i<5;i++){ var opt = new Option("值"+i,"value"+i); select.options[i] = opt; } } function delone(){ } function clearAll(){ //只要把options的长度改为0就可以的 var city = document.getElementById("city"); city.options.length = 0; } </script> </head> <body id="test"> <input type="button" value="创建一个城市列表框" onclick="createSelect()"/> <input type="button" value="一条条删除列表框内容" onclick="delone()"/> <input type="button" value="一次性清空列表框内容" onclick="clearAll()"/> </body> </html>