Javascript获取value值的三种方法及注意点
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Javascript获取value值的三种方法及注意点
今天在js中用id名直接获取value值时遇到点问题，所以顺便做一下总结。
JavaScript获取value值，主要有以下三种：
1.用document.getElementById(“id名”).value来获取（例1）；
2.通过form表单中的id名或者name名来获取（例2）。
3.通过id名（不用写getElementById，也不用放在表单中）直接获取value值（例3）。
但是直接通过value值获取需要注意以下几点：
①变量名不能和id名一样，否则无效；
②函数名不能和id名一样，否则无效；
③如果需要获取的id外面还有盒子，不能像表单那样，将盒子的name或者id写在前面，eg： var aa=box.need_id.value 是不行的，应该直接写 var aa=need_id.value ;
例1：
用document.getElementById(“id名”).val ue来获取
1.<!doctype html>
2.<html lang='en'>
3.<head>
4.<meta charset='UTF-8'>
5.<title>example</title>
6.</head>
7.<body>
8.<!--文本输入框-->
9.<input type='text' id='input'>
10.<br>
11.<!--通过点击click按钮，弹窗中显示文本框内用户输入的内容-->
12.<input type='button' value='click' id='btn' οnclick='start()'>
13.<script>
14.function start(){
15.var aa=document.getElementById('input').value; //通过document.getElementById(“id名”).value来获取value值。
16.alert(aa);
17.}
18.</script>
19.</body>
20.</html>
例2：
通过表单中的id或者name获取value值，效果和例1是一样一样的
1.<body>
2.<form action='' name='frm'>
3.<!--放在表单中的文本输入框-->
4.<input type='text' id='input1' name='input2' >
5.<br>
6.<!--通过点击click按钮，弹窗中显示文本框内用户输入的内容-->
7.<input type='button' value='click' id='btn' οnclick='start()'>
8.</form>
9.<script>
10.function start(){
11.var aa=frm.input1.value; //通过表单中的id获取value值;或者 var aa=frm.input2.value;通过name获取也可以。
12.alert(aa);
13.}
14.</script>
15.</body>
例3：
直接通过id名获取value值，效果也和例1是一样一样的
1.<!doctype html>
2.<html lang='en'>
3.<head>
4.<meta charset='UTF-8'>
5.<title>example</title>
6.</head>
7.<body>
8.<!--文本输入框-->
9.<input type='text' name='input1' id='input2'>
10.<br>
11.<!--通过点击click按钮，弹窗中显示文本框内用户输入的内容-->
12.<input type='button' value='click' id='btn' οnclick='start()'>
13.<script>
14.function start(){
15.var aa=input2.value; //直接通过id名获取value值，但是如果写 var input2=input2.value; alert(input2)则无效。
16.alert(aa);
17.}
18.</script>
19.</body>
20.</html>。