getElementById() getElementsByName() getElementsByTagName()
http://www.cnblogs.com/winner/archive/2007/03/28/593028.html
1、getElementById()
getElementById()可以访问DOCUMENT中的某一特定元素,顾名思义,就是通过ID来取得元素,所以只能访问设置了ID的元素。
比如说有一个DIV的ID为docid:
<div id="docid"></div>
那么就可以用getElementById("docid")来获得这个元素。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>ById</title> <style type="text/css"> <!-- #docid{ height:400px; width:400px; background-color:#999;} --> </style> </head> <body><div id="docid" name="docname" onClick="bgcolor()"></div> </body> </html> <script language="JavaScript" type="text/JavaScript"> <!-- function bgcolor(){ document.getElementById("docid").style.backgroundColor="#000" } --> </script>
2、getElementsByName()
如果一个文档中有两个以上的标签NAME相同,那么getElementsByName()就可以取得这些元素组成一个数组。
比如有两个DIV:
<div name="docname" id="docid1"></div>
<div name="docname" id="docid2"></div>可
以用getElementsByName("docname")获得这两个DIV,用getElementsByName("docname")[0]访问第一个DIV。
3、getElementsByTagName()
这个呢就是通过TAGNAME(标签名称)来获得元素,一个DOCUMENT中当然会有相同的标签,所以这个方法也是取得一个数组。下面这个例子有两个DIV,可以用getElementsByTagName("div")来访问它们,用getElementsByTagName("div")[0]访问第一个DIV,用getElementsByTagName("div")[1]访问第二个DIV。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Byname,tag</title> <style type="text/css"> <!-- #docid1,#docid2{ margin:10px; height:400px; width:400px; background-color:#999;} --> </style> </head> <body> <div name="docname" id="docid1" onClick="bgcolor()"></div> <div name="docname" id="docid2" onClick="bgcolor()"></div> </body> </html> <script language="JavaScript" type="text/JavaScript"> <!-- function bgcolor(){ var docnObj=document.getElementsByTagName("div"); docnObj[0].style.backgroundColor = "black"; docnObj[1].style.backgroundColor = "black"; } --> </script>
总结一下标准DOM,访问某一特定元素尽量用标准的getElementById(),访问标签用标准的getElementByTagName(),但IE不支持getElementsByName(),所以就要避免使用getElementsByName()。
转载于:https://blog.51cto.com/5563447/1269487
getElementById() getElementsByName() getElementsByTagName()相关推荐
- (转)getElementByID getElementsByName getElementsByTagName用法详解
(转)getElementByID getElementsByName getElementsByTagName用法详解 getElementByID getElementsByName getEle ...
- getElementByID() getElementsByName() getElementsByTagName()的区别 .
getElementByID() getElementsByName() getElementsByTagName()的区别 Web标准下可以通过getElementById(), getElemen ...
- javascript getElementByID,getElementsByName,getElementsByTagName的区别
getElementByID,getElementsByName,getElementsByTagName区别 注意:方法区分大小写! 以人来举例说明,人有能标识身份的身份证,有姓名,有类别(大人.小 ...
- getElementByID getElementsByName getElementsByTagName用法详解
WEB标准下可以通过getElementById(), getElementsByName(), and getElementsByTagName()访问DOCUMENT中的任一个标签: 1.getE ...
- getElementById getElementsByName的用法与区别(转)
标签: getElementById getElementsByName getElementsByTagName getElementById: 语法: document.getElementB ...
- 获取表单对象,得三种方法getElementById(), getElementsByName(), and getElementsByTagName() 和用法...
今天碰到了翻页不好用的问题,检查一下发现没有表单,加上去就好了,发现获取某个对象值的方法有很多,但是使用哪一个才是正规的途径那,问了同事,得出结论如下: document.表单名称.对象名称.属性 ...
- getElementById,getElementsByTagName,getElementsByName,getElementsByClassName的区别
大家有时候会对getElementById,getElementsByTagName,getElementsByName,getElementsByClassName这几个函数理解不小心搞混了,这几个 ...
- DOM的getElementById() 和 getElementsByTagName() 方法
DOM查找并访问节点getElementById() 和 getElementsByTagName() 方法 可查找整个 HTML 文档中的任何 HTML 元素,getElementById() 无法 ...
- getElementById、getElementsByTagName、getElementsByClassName复合使用浅析
最近遇到一个关于查找元素的问题,有的时候单独使用getElementById.getElementsByTagName.getElementsByClassName并不足以找到需要的元素,于是我就查找 ...
最新文章
- 编程疑难杂症の怪诞的【黄色警告】
- 排除瓶颈和加速django项目
- 【十二省联考2019】希望【点边容斥】【换根dp】【长链剖分】【线性数据结构】【回退数据结构】【离线逆元】
- 各级期刊分类以及含金量//2021-2-4
- 队列,计算机中的排队模型
- Centos7上安装docker
- 2022完整iOS APP发布App Store上架流程指南
- myeclipse中设置括号匹配颜色
- MNE预处理脑电数据
- 第一集 斗罗世界 第六章
- 搭建asp会议签到系统 第二章 生成会议签到二维码
- Teiid 基于数据联邦的集成方案
- python之matplotlib 3.2.1之spines不显示右侧和顶端的坐标轴
- php处理微信消息,微信开发之处理微信客户端发来的消息
- Praat将连续录制的声音文件切成小单位文件
- 在线渗透测试网址信息收集网站-密码工具-漏洞查找平台-安全视频平台
- C源码:常用攻击程序
- nginx+php 上传含有php脚本的木马图片文件的漏洞解决
- python基于深度学习的老照片修复系统
- 我对这产品有个理解二--脸萌