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

一、方式

方式1：document.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 等标准方法。

详解地址：https://www.jb51.net/article/116460.htm

转载于:https://www.cnblogs.com/shelly0307/p/10916069.html

Javascript定位表单控件的几种方式相关推荐

HTML中禁用表单控件的两种方法readonly与disabled
时候我们会希望表单上的控件是不可修改的,比如在修改密码的网页中,显示用户名的文本框就应该是不可修改状态的,下面与大家分享下禁用表中控件的两种方法在网页的制作过程中,我们会经常使用到表单.但是有时候我 ...
Bootstrap3 表单控件的状态
控件的状态在表单的使用过程中,每个控件可能都会有很多状态,通过表单控件的状态,可以给用户或访问者提供一些有用的反馈. Bootstrap为表单控件提供了 4 种状态,分别是获得焦点状态.禁用状态.只 ...
『ExtJS』表单（一）常用表单控件及内置验证
几点说明关于ExtJS的表单,我打算分为三个部分来写常用表单控件及内置验证 -- 这里主要是JS代码表单行为与Asp.NET页面的消息回复 -- 这里既有JS代码,与有C#代码,我主要是使用As ...
Bootstrap表单控件的尺寸
控件的尺寸在Bootstrap中,可以通过类似.input-lg的类为控件设置高度,类似.col-*的类为控件设置宽度. 1.高度尺寸一般情况下,控件的默认高度就能满足要求.当然,你也可以为控件添 ...
Bootstrap 表单控件的状态
在使用过程中,每个控件可能都会有很多状态,通过表单控件的状态,可以给用户或访问者提供一些有用的反馈. Bootstrap提供了 4 种状态,分别是获得焦点状态.无效输入状态.禁用状态.验证状态,并为每 ...
Bootstrap 表单控件的尺寸
在Bootstrap中,有三种设置控件尺寸的方法,一种是让控件成为块级元素,一种是使用相对尺寸,一种是使用网格尺寸. 1.让控件成为块级元素如果想让控件像块级元素一样占满容器,就可以为它添加 .in ...
js模拟表单html形式,JS模拟并美化的表单控件完整实例
本文实例讲述了JS模拟并美化的表单控件效果实例.分享给大家供大家参考.具体如下: 这里演示使用JS美化并模拟网页表单控件,十分漂亮的表单效果,使用时可以将代码内的JS保存为文件, 方便调用,使用方法: ...
表单和表单控件以及表单域详解
表单域:存放表单的区域.把表单控件里面的信息全部收集提交. 表单控件 input表单控件: 1.是个单标签 </input> 2.input可以通过type(类型)属性来变换形状单选按钮 ...
[原创]FineUI秘密花园（六） — 表单控件
FineUI中有哪些常用的表单控件,它们有什么共同点和不同点,这一篇文章我们会详细解说. 表单控件的公共属性所有的表单都具有如下属性: ShowLabel:是否显示标签(默认值:true). Sho ...
第十四篇表单控件 - 购物车页面
上一篇内容已经简单的介绍了表单控件以及表单控件的绑定,有登录界面输入的用户信息(userInfo)是否需要启动 "记住" 功能,"记住" 是一个记录登录状态, ...

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

Javascript定位表单控件的几种方式相关推荐

最新文章

热门文章