没有document.getElementByName方法


Posted in Javascript onAugust 19, 2013

首先声明的是:
document.getElementByName方法没有。document.getElementsByName得到的是标签的数组
document.getElementId得到的是某一个标签
<form name="form_write">
<input name="content" type="text">

然而可以用很浅显的方式得到如:

var fn = document.getElementsByName("form_write")[0]; //得到这个form下的对象
fn.content.value;//就直接去用这个对象取值就可以了。
document.getElementById 1、getElementById

作用:一般页面里ID是唯一的,用于准备定位一个元素
语法: document.getElementById(id)
参数:id :必选项为字符串(String)
返回值:对象; 返回相同id对象中的第一个,按在页面中出现的次序,如果无符合条件的对象,则返回 null

example:

document.getElementById("id1").value;

2、getElementsByName

作用:按元素的名称查找,返回一个同名元素的数组
语法: document.getElementsByName(name)
参数:name :必选项为字符串(String)
返回值:数组对象; 如果无符合条件的对象,则返回空数组,按在页面中出现的次序
注意:返回数组值为value属性的值,
如果某标签无value属性,当你添加上value属性并赋值后,getElementsByName也能取到其值,
当未对value属性赋值时, getElementsByName返回数组值将是undefined ,
但仍能获得相同name标签的个数document.getElementsByName(name).length
当未设置name属性时document.getElementsByName仍能使用,它将根据你id取得value属性的值

example:

document.getElementsByName("name1")[0].value; 
document.getElementsByName("name1")[1].value; 
<span id='CBylawIndexName' class='normalNode' value='all' >全部</span>" 
<span id='CBylawIndexName' class='normalNode' value='ALL' >全部</span>"

span标签其实没有name和value属性
但document.getElementsByName("CBylawIndexName")仍将取得value的值

3、getElementsByTagName

作用:按HTML标签名查询,返回一个相同标签元素的数组
语法: object.getElementsByTagName(tagname) object可以是document或event.srcElement.parentElement等
参数:tagname:必选项为字符串(String),根据HTML标签检索。
返回值:数组对象; 如果无符合条件的对象,则返回空数组,按在页面中出现的次序

example:

document.getElementsByTagName("p")[0].childNodes[0].nodeValue; 
document.getElementsByTagName("p")[1].childNodes[0].nodeValue;
Javascript 相关文章推荐
javascript 有趣而诡异的数组
Apr 06 Javascript
使用apply方法实现javascript中的对象继承
Dec 16 Javascript
JavaScript框架是什么?怎样才能叫做框架?
Jul 01 Javascript
Vue.js学习笔记之 helloworld
Aug 14 Javascript
Bootstrap下拉菜单更改为悬停(hover)触发的方法
May 24 Javascript
获取当前按钮或者html的ID名称实例(推荐)
Jun 23 Javascript
js正则表达式校验指定字符串的方法
Jul 23 Javascript
angularJs复选框checkbox选中进行ng-show显示隐藏的方法
Oct 08 Javascript
从vue源码看props的用法
Jan 09 Javascript
JavaScript多种滤镜算法实现代码实例
Dec 10 Javascript
JavaScript 禁止用户保存图片的实现代码
Apr 28 Javascript
小程序自动化测试的示例代码
Aug 11 Javascript
js中符号转意问题示例探讨
Aug 19 #Javascript
window.opener用法和用途实例介绍
Aug 19 #Javascript
JavaScript异步编程:异步数据收集的具体方法
Aug 19 #Javascript
文本框中禁止非数字字符输入比如手机号码、邮编
Aug 19 #Javascript
JQUERY 获取IFrame中对象及获取其父窗口中对象示例
Aug 19 #Javascript
时间戳转换为时间 年月日时间的JS函数
Aug 19 #Javascript
详解JavaScript函数绑定
Aug 18 #Javascript
You might like
PHP开发中四种查询返回结果分析
2011/01/02 PHP
PHP开发框架kohana3 自定义路由设置示例
2014/07/14 PHP
PHP书写格式详解(必看)
2016/05/23 PHP
PHP 7.4中使用预加载的方法详解
2019/07/08 PHP
Laravel 手动开关 Eloquent 修改器的操作方法
2019/12/30 PHP
让mayfish支持mysqli数据库驱动的实现方法
2010/05/22 Javascript
jQuery验证Checkbox是否选中的代码 推荐
2011/09/04 Javascript
javascript操作JSON的要领总结
2012/12/09 Javascript
jQuery ajax(复习)—Baidu ajax request分离版
2013/01/24 Javascript
js中数组Array的一些常用方法总结
2013/08/12 Javascript
将input file的选择的文件清空的两种解决方案
2013/10/21 Javascript
js动态设置div的值下例子
2013/10/29 Javascript
jQuery 获取和设置select下拉框的值实现代码
2013/11/08 Javascript
JavaScript获取页面上被选中文字的方法技巧
2015/03/13 Javascript
使用控制台破解百小度一个月只准改一次名字
2015/08/13 Javascript
jquery实现二级导航下拉菜单效果
2015/12/18 Javascript
jQuery Mobile 和 Kendo UI 的比较
2016/05/05 Javascript
html+js实现简单的计算器代码(加减乘除)
2016/07/12 Javascript
学习vue.js计算属性
2016/12/03 Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
2017/05/24 jQuery
vue-router 实现导航守卫(路由卫士)的实例代码
2018/09/02 Javascript
微信小程序云开发之使用云数据库
2019/05/17 Javascript
layer实现弹出层自动调节位置
2019/09/05 Javascript
转换layUI的数据表格中的日期格式方法
2019/09/19 Javascript
Python实现希尔排序算法的原理与用法实例分析
2017/11/23 Python
python 同时读取多个文件的例子
2019/07/16 Python
django之自定义软删除Model的方法
2019/08/14 Python
Pycharm+django2.2+python3.6+MySQL实现简单的考试报名系统
2019/09/05 Python
scrapy数据存储在mysql数据库的两种方式(同步和异步)
2020/02/18 Python
利用python汇总统计多张Excel
2020/09/22 Python
python字符串拼接+和join的区别详解
2020/12/03 Python
大学生年度自我鉴定
2013/10/31 职场文书
8和9的加减法教学反思
2014/05/01 职场文书
商业门面租房协议书
2014/11/25 职场文书
幼儿园教学反思范文
2016/03/02 职场文书
Java设计模式之享元模式示例详解
2022/03/03 Java/Android