html表的可访问性,javascript怎么访问表单?

JavaScript可以像访问页面中其它元素一样,使用原生DOM方法访问表单元素。此外,每个表单都有elements属性,该属性是表单中所有元素的集合。

d0fe75468358cb47f6ef10dd01617c19.png

elements集合是一个有序列表,其中包含着表单中所有字段,例如、、和。每个表单字段在elements集合中的顺序,与它们出现在标记中的顺序相同,可以按照位置和name特性来访问它们。

下面来看一个例子:var form = document.getElementById("form1")

//取得表单中的第一个字段

var field1 = form.elements[0];

//取得名为textbox1的字段

var field2 = form.elements["textbox1"];

//取得表单中包含的字段的数量

var fieldCount = form.elements.length;

如果有多个表单控件都在使用一个name(如单选按钮),那么就会返回以该name命名的一个NodeList。例如,以下面的HTML代码片段为例:

在这个HTML表单中,有3个单选按钮,它们的name属性都是“color”,意味着这3个字段是一起的。在访问 elements["color"]时,就会返回一个NodeList,其中包含3个元素;不过,如果访问elements[0],则只会返回第一个元素。

来看下面的例子:var form = document.getElementById("myForm");

var colorFields = form.elements["color"];

alert(colorFields.length); //3

var firstColorField = colorFields[0];

var firstFormField = colorFields[0];

alert(firstColorField === firstFormField); //true

以上代码显示,通过form.elements[0]访问到的第一个表单字段,与包含在form.elements["color"]中的第一个元素相同。

也可以通过访问表单的属性来访问元素,例如form[0]可以取得第一个表单字段,而form["color"]则可以取得第一个命名字段。这些属性与通过elements集合访问到的元素是相同的。但是,我们应该尽可能使用elements,通过表单属性访问元素只是为了与旧浏览器向后兼容保留的一种过渡方式。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值