您当前的位置:首页 > 网站建设笔记 >

javascript如何引用表单元素

来源:JavaScript高级程序设计(第3版)0

JavaScript最初的一个应用,就是分担服务器处理表单的责任,打破处处依赖服务器的局面。尽管目前的Web和JavaScript已经有了长足的发展,但Web表单的变化并不明显。由于Web表单没有为许多常见任务提供现成的解决手段,很多开发人员不仅会在验证表单时使用JavaScript,而且还增强了一些标准表单控件的默认行为。

表单的基础知识

在HTML中,表单是由<form>元素来表示的,而在JavaScript中,表单对应的则是HTMLFormElement类型。HTMLFormElement继承了HTMLElement,因而与其他HTML元素具有相同的默认属性。不过,HTMLFormElement也有它自己下列独有的属性和方法。

  • acceptCharset:服务器能够处理的字符集;等价于HTML中的accept-charset特性。
  • action:接受请求的URL;等价于HTML中的action特性。
  • elements:表单中所有控件的集合(HTMLCollection)。
  • enctype:请求的编码类型;等价于HTML中的enctype特性。
  • length:表单中控件的数量。
  • method:要发送的HTTP请求类型,通常是"get"或"post";等价于HTML的method特性。
  • name:表单的名称;等价于HTML的name特性。
  • reset():将所有表单域重置为默认值。
  • submit():提交表单。
  • target:用于发送请求和接收响应的窗口名称;等价于HTML的target特性。

取得<form>元素引用的方式有好几种。其中最常见的方式就是将它看成与其他元素一样,并为其添加id特性,然后再像下面这样使用getElementById()方法找到它。

var form = document.getElementById("form1");

其次,通过document.forms可以取得页面中所有的表单。在这个集合中,可以通过数值索引或name值来取得特定的表单,如下面的例子所示。

//取得页面中的第一个表单
var firstForm = document.forms[0];
//取得页面中名称为form2的表单
var myForm = document.forms["form2"];

另外,在较早的浏览器或者那些支持向后兼容的浏览器中,也会把每个设置了name特性的表单作为属性保存在document对象中。例如,通过document.form2可以访问到名为"form2"的表单。不过,我们不推荐使用这种方式:一是容易出错,二是将来的浏览器可能会不支持。

注意,可以同时为表单指定id和name属性,但它们的值不一定相同。

建站咨询

咨询热线

微信交流

返回顶部