Javascript定位表单控件的几种方式

一、方式

方式1document.getElementById

document.getElementById('year').value='2002'

方式2:通过name属性

document.getElementsByName('name').value='2002'

方式3:通过标签名

document.getElementsByTagName('p').value='2002'
方式4:通过类名
document.getElementsByClassName('p').value='2002'

方式5:通过表单
document.Form1.year.value
='2002';

方式6:document.all(不推荐)

document.all.year.value='2002';

document.all["year"].value= '2002';

 

方式7:jquery 
$(".year").val();//   jquery 根据class 获取值
$("#year").val();   //  id jquery 根据获取值
 
二、各自的特点
1、document.getElementById
在IE6、7中会把表单元素的name当做ID值获取到。一个是name="category_id" 一个是id="category_id"。用document.getElementById取第二个,但是,取到的却是第一个name=category_id。在IE中getElementById居然不是先抓id而是先找name同样的物件。
建议:同一个标签,name和id用相同的值,如<input type="text" name="username"  id="username"/>
 
2、document.getElementsByName

1)获取的结果是一个类数组,不是数组。

2)在IE浏览器中只能获取到表单元素,当然我们一般也只用它获取表单元素,从ie10开始可以不只是表单元素。

 

4、document.getElementsByClassName

1)获取的结果是一个类数组。

 

2)IE8以及以前版本不兼容。

 
6、document.all(不推荐使用)
all 方法最初是由 IE 浏览器拥有的,并不属于 W3C 规范范畴,他返回调用 all 方法的 HTML 标记自身内的所有子孙元素的 HTML 标记集合 。
原因:document.all 在各浏览器中的支持不同:https://blog.csdn.net/fengweifree/article/details/16862495
由于 document.all 方法存在支持程度问题,获取元素还是推荐用 W3C DOM 规范中提供的 document.getElementById、document.getElementsByTagName 等标准方法。
 
 
posted @ 2019-05-24 09:20  shelly双鱼座  阅读(869)  评论(0编辑  收藏  举报