<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input id="btn" type="button" value="获取文本框的值"> <script> // 1 当页面加载完毕，给所有的文本框赋值 var inputs = document.getElementsByTagName('input'); for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; // 根据type属性 判断是否是文本框 if (input.type === 'text') { input.value = i; } } // 2 当点击按钮的时候，获取所有文本框的值，并使用 | 分割输出 // 0|1|2 var btn = document.getElementById('btn'); btn.onclick = function () { var s = ''; for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; // 判断是否是文本框 if (input.type === 'text') { s += input.value + '|'; } } // 把最后一个| 去掉 s = s.substr(0, s.length - 1); console.log(s); } </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input id="btn" type="button" value="获取文本框的值"> <script> // 1 当页面加载完毕，给所有的文本框赋值 var inputs = document.getElementsByTagName('input'); for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; // 根据type属性 判断是否是文本框 if (input.type === 'text') { input.value = i; } } // 2 当点击按钮的时候，获取所有文本框的值，并使用 | 分割输出 // 0|1|2 var btn = document.getElementById('btn'); btn.onclick = function () { var array = []; for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; // 判断是否是文本框 if (input.type === 'text') { array.push(input.value); } } console.log(array.join('|')); } </script> </body> </html>