9.26 DOM基础练习
DOM实例
<style> #s1 { width: 100px; } </style> </head> <body> <select id="s1" size="7"> </select> <input id="txt1" type="text" /> <input id="btn1" type="button" value="提交" /> <input id="btn2" type="button" value="删除" /> </body> </html> <script> var s1 = document.getElementById("s1"); var txt1 = document.getElementById("txt1"); var btn1 = document.getElementById("btn1"); var btn2 = document.getElementById("btn2"); btn1.onclick = function() { // 字符串拼接方法 // s1.innerHTML += "<option>" // + txt1.value // + "</option>"; // 造对象方法 var opt = document.createElement('option'); opt.innerText = txt1.value; s1.appendChild(opt); txt1.value = ''; } btn2.onclick = function(){ // s1.selectedIndex // s1.selectedOptions[0] // appendChild // removeChild s1.removeChild(s1.selectedOptions[0]); } </script>