JavaScript中取到form的值的方法

如有以下代码：

<form action="get.do" method="post" id="fi" name="fn">
			username:<input type="text" id="username"/><br/>
			password:<input type="password" id="password"/><br/>
			<input type="submit" value="submit">
</form>

 
可以通过以下三种方式（我所知道的）来取到值：
var show = document.fn.elements['username'].value;//注意这里fn是form的名字，而不是id
var show = document.getElementById('username').value;
var show = fi['username'].value;//fi是form的id号码

 

在百度悬赏20分拿到一个很不错的答案：

 

1、通过对象的位置来引用,如下：
var msg=document.forms[0].elements[0].value; 
2、通过name属性访问文档对象：
var msg=document.myForm.myText.value; //设name="myForm"和="myText"
3、通过id属性访问文档对象：
var msg=document.getElementById('myText'); 
4、通过联合数组访问文档对象：
var msg=document.forms['myForm'].elements['myText'].value; //只支持火狐！
var msg=document.forms('myForm').elements('myText').value; //只支持IE！
5、通过IE提供的item()方法访问文档对象：
var msg=document.forms.item("myText"); 
6、通过元素标签返回指定对像：
var msg=document.getElementsByTagName("tr"); //参数可以为'*',表示找所有的元素对象 
7、多对象数组时可分步访问：
var myObj=document.objects; 
var msg=myObj[i].value; 
8、访问对象的所有子对象：
for (i=0;i<example.childNodes.length;i++) //example为假设对象 
msgs=example.childNodes.item(i).nodeName;
或： 
for (i=0;i<example.childNodes.length;i++) //example为假设对象 
msgs=example.childNodes[i].nodeName;

window为浏览器窗口对象,为文档提供显示容器,即与浏览器相关,如窗口的大小和关闭窗口等属性及方法,属于最顶级对象...
document与上不同,即与当前载入的文档相关,包括当前浏览器窗口或框架区域中的所有内容,包含文本域,按钮...等HTML页面可访问元素.
element文档中的元素对象,是可见的,或者说是标签,不同于Node对象,这是我自已的理解,或许有不确切这处,请提出来,哈哈

评论

57 楼 yjl6691088 2011-02-04  

bepatient 写道

風一樣的男子 写道

这帖子不是一般的水

首先，这帖子上主页不是我做主的，我只是在这里记下我的笔记而已；
其次，再“水”的帖子对有些人也是有帮助的，哪个老鸟不是从菜鸟走过来的；
最后，你们在这里放“这些话”显得你们很没有素质。

首先，记笔记有博客。
其次，既然发帖就要有被喷的觉悟。
最后，这种问题搜一下一大把，多动脑，勤懂手。共勉...

56 楼 wjyuian 2011-02-03  

我觉得javascript里面，没指定是getXXXById，一般都是按照name来获取元素dom对象，或其数组。。
不能用其他js框架的情况下，只能用原生的js，不过自己可以写个很简单的选择器来操作。

如果可以用框架的话，个人觉得jQuery不错，选择器够强大，只要想的到的选择方式，其选择器都能满足，又有强大的筛选选择器。。而且兼容性也基本没问题。。毕竟是经历过大风大浪的js框架

55 楼 kyfxbl 2011-01-25  

我指的是LZ的头像

54 楼 kyfxbl 2011-01-25  

这个良好帖相当良好

53 楼 xiaojing3517 2010-07-05  

風一樣的男子 写道

bepatient 写道

風一樣的男子 写道

这帖子不是一般的水

首先，这帖子上主页不是我做主的，我只是在这里记下我的笔记而已；
其次，再“水”的帖子对有些人也是有帮助的，哪个老鸟不是从菜鸟走过来的；
最后，你们在这里放“这些话”显得你们很没有素质。

。。。
我只是说帖子很水，你激动啥？怎么就牵扯素质问题了？
当然，再简单的问题也有人不知道
这很正常，但我说水我只是认为这个问题太简单
稍微会点JavaScript的人都知道
为什么就那么激动？动不动就要上纲上线？

楼主说话句句不离素质，但是鄙人眼挫，却没看出来楼主所说的素质在哪里。

52 楼 lobbychmd 2010-07-05  

如果做 asp.net 很真很多人不用 id 和 name 。。。

51 楼 風一樣的男子 2010-07-05  

另外我从不提倡 IE Only 写法
那么多写法，其实 document.getElementById('id') 就够我用了

50 楼 風一樣的男子 2010-07-05  

bepatient 写道

風一樣的男子 写道

这帖子不是一般的水

首先，这帖子上主页不是我做主的，我只是在这里记下我的笔记而已；
其次，再“水”的帖子对有些人也是有帮助的，哪个老鸟不是从菜鸟走过来的；
最后，你们在这里放“这些话”显得你们很没有素质。

。。。
我只是说帖子很水，你激动啥？怎么就牵扯素质问题了？
当然，再简单的问题也有人不知道
这很正常，但我说水我只是认为这个问题太简单
稍微会点JavaScript的人都知道
为什么就那么激动？动不动就要上纲上线？

49 楼 cpdw 2010-07-05  

支持LZ，有些人就是不知所谓，可能觉得一个form取值有什么可说的。所有的技术都是由1+1=2这样的简单问题组合而成，天外有天，人外有人，每个人都有很多不懂的，但却非常基础的问题。不要瞧不起任何一个小问题。我相信，任何人不会是生下来就知道html是什么东西，都是慢慢学会的。JavaEye是java爱好者的社区，不是你们这些所谓java“高手”臭显摆的地方，如果你们真有本事，我相信绝不会到这来回复这些废话。我没本事，只会逛逛论坛，如果“高手”们看不惯，请离开我们的社区，谢谢。

48 楼 wv1124 2010-07-04  

菜鸟贴,哈哈

47 楼 Jie_Jie 2010-07-04  

moses3017 写道

xzj127 写道

JE 现在的帖子 不如以前了....

JE 不如以前了....

JE 人不如以前了....

46 楼 fireflyman 2010-07-04  

JE,唉~~

45 楼 Asdpboy 2010-07-04  

此贴乃良好帖也！

44 楼 wskhkhtd 2010-07-03  

主流采用下面的方式获取页面元素值,简单才是硬道理
var username=$("username").value;
var password=$("password").value;

43 楼 nbkangta 2010-07-03  

beijing2009 写道

bepatient 写道

zhao103804 写道

这样不就取到了吗
var show = document.fn.username.value;//
为什么要这样写呢
var show = document.fn.elements['username'].value;//

嗯，果然这种比较方便。谢了。
请教您一个问题：以上var show = document.fn.username.value;fn是name，username是id，这个怎么区别，怎么理解呢？这个id和name老师混淆了。请您赐教！

关于name和id的区别
id语法：
HTML <ELEMENT ID = sID... > 
Scripting ：object.id [ = sID ]

“The id should be unique throughout the scope of the current document. If a document contains more than one object with the same identifier, the objects are exposed as a collection that can be referenced only in ordinal position.”
name语法：
HTML <ELEMENT NAME = sName... > 
Scripting： object.name [ = sName ]

在摘要中没有上面加引号那一段

所以，上面的情况你用name和id效果都是一样的

在IE中，可以直接把name或者ID当做window的变量来引用，但是经常会出现ID和name混淆的情况

42 楼 kjj 2010-07-03  

windchill_java 写道

mp_juan 写道

moses3017 写道

xzj127 写道

JE 现在的帖子 不如以前了....

JE 不如以前了....

赞同

同

赞同,应该说终于放下了高傲的姿态,开始向一般大众靠拢了

41 楼 beijing2009 2010-07-02  

bepatient 写道

zhao103804 写道

这样不就取到了吗
var show = document.fn.username.value;//
为什么要这样写呢
var show = document.fn.elements['username'].value;//

嗯，果然这种比较方便。谢了。
请教您一个问题：以上var show = document.fn.username.value;fn是name，username是id，这个怎么区别，怎么理解呢？这个id和name老师混淆了。请您赐教！

关于name和id的区别
id语法：
HTML <ELEMENT ID = sID... > 
Scripting ：object.id [ = sID ]

“The id should be unique throughout the scope of the current document. If a document contains more than one object with the same identifier, the objects are exposed as a collection that can be referenced only in ordinal position.”
name语法：
HTML <ELEMENT NAME = sName... > 
Scripting： object.name [ = sName ]

在摘要中没有上面加引号那一段

所以，上面的情况你用name和id效果都是一样的

40 楼 xiaojing3517 2010-07-02  

楼主句句不离素质，话说素质到底是个啥啊？哎，素质，素质

39 楼 chris_zley 2010-07-02  

红字才是亮点

document.formname直接访问到form节点了，楼主你说的3中方法平时我基本没用过

38 楼 化蝶自在飞 2010-07-02  

从这么多帖子里,我分明看出了人云亦云这么一个词.