js基本增删查

来源:互联网 发布:入门红酒 知乎 编辑:程序博客网 时间:2024/05/17 16:46
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test6</title> <script> var x = 4; //给按钮添加点击事件 function add(){ //添加输入框 //1.创建输入框 var input = document.createElement("input"); //2.给输入框添加属性 input.value = "输入框" + x; x++; //3.将输入框放入指定位置(最后面) var center = document.getElementById("center"); center.appendChild(input); var br = document.createElement("br"); center.appendChild(br); } function show(){ var inputs = document.getElementsByTagName("input"); //alert(inputs.length); //var arr = []; var str = ""; /*for(i in inputs){ str = str + inputs[i].value; }*/ for(i=0;i<inputs.length;i++){ str = str + inputs.item(i).value; } alert(str); } function clears(){ //alert("asdf"); var inputs = document.getElementsByTagName("input"); for(i=0;i<inputs.length;i++){ inputs.item(i).value = ""; //alert(inputs.item(i).value); } } </script> </head>   <body> <center id="center"> <button onclick="add()">增加</button> <button onclick="show()">展示文本</button> <button onclick="clears()">清空内容</button><br/><br/> <input type="text" value="输入框1" /><br/> <input type="text" value="输入框2" /><br/> <input type="text" value="输入框3" /><br/> </center> </body> </html>
原创粉丝点击