DOM对象控制HTML无素——详解1
getElementsByName()方法
返回带有指定名称的节点对象的集合。
语法:
document.getElementsByName(name)
与getElementById() 方法不同的是,通过元素的 name 属性查询元素,而不是通过 id 属性。
注意:
1. 因为文档中的 name 属性可能不唯一,所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素。
2. 和数组类似也有length属性,可以和访问数组一样的方法来访问,从0开始。
<body>
<p name="pn">getElementsByName</p>
<p name="pn">getElementsByName</p>
<p name="pn">getElementsByName</p>
<p name="pn">getElementsByName</p>
<script>
var pn = document.getElementsByName("pn")[0].innerHTML = "new"
</script>
</body>
getElementsByTagName()方法
返回带有指定标签名的节点对象的集合。返回元素的顺序是它们在文档中的顺序。
语法:
getElementsByTagName(Tagname)
说明:
1. Tagname是标签的名称,如p、a、img等标签名。
2. 和数组类似也有length属性,可以和访问数组一样的方法来访问,所以从0开始。
<body>
<p>getElementsByTagName</p>
<p>getElementsByTagName</p>
<p>getElementsByTagName</p>
<p>getElementsByTagName</p>
<script>
var tagName = document.getElementsByTagName("p")[0].innerHTML = "new"
</script>
</body>
区别getElementByID,getElementsByName,getElementsByTagName
以人来举例说明,人有能标识身份的身份证,有姓名,有类别(大人、小孩、老人)等。
1. ID 是一个人的身份证号码,是唯一的。所以通过getElementById获取的是指定的一个人。
2. Name 是他的名字,可以重复。所以通过getElementsByName获取名字相同的人集合。
3. TagName可看似某类,getElementsByTagName获取相同类的人集合。如获取小孩这类人,getElementsByTagName("小孩")。
<body>
<p id="pid" name="pn">tagname,id,name</p>
<script>
var tagName = document.getElementsByTagName("p")[0].innerHTML
var name = document.getElementsByName("pn")[0].innerHTML
var id = document.getElementById("pid").innerHTML
document.write(tagName+" "+name+" "+id)
</script>
</body>
getAttribute()方法
通过元素节点的属性名称获取属性的值。
语法:
elementNode.getAttribute(name)
说明:
1. elementNode:使用getElementById()、getElementsByTagName()等方法,获取到的元素节点。
2. name:要想查询的元素节点的属性名字
<body>
<a href="www.baidu.com" id="aid"></a>
<script>
var a = document.getElementById("aid")
var getattr = a.getAttribute("href")
alert(getattr)
</script>
</body>
setAttribute()方法
setAttribute() 方法增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。
语法:
elementNode.setAttribute(name,value)
说明:
1.name: 要设置的属性名。
2.value: 要设置的属性值。
注意:
1.把指定的属性设置为指定的值。如果不存在具有指定名称的属性,该方法将创建一个新属性。
2.类似于getAttribute()方法,setAttribute()方法只能通过元素节点对象调用的函数。
<body>
<a href="www.baidu.com" id="aid"></a>
<script>
var a = document.getElementById("aid")
var setattr1 = a.setAttribute("href","www.google.com")
var getattr1 = a.getAttribute("href")
alert(getattr1)
var setattr2 = a.setAttribute("title","这是第二种设置属性节点")
var getattr2 = a.getAttribute("title")
alert(getattr2)
</script>
</body>
DOM对象控制HTML无素——详解1的更多相关文章
- DOM对象控制HTML无素——详解3
创建元素节点createElement createElement()方法可创建元素节点.此方法可返回一个 Element 对象. 语法: document.createElement(tagName ...
- DOM对象控制HTML无素——详解2
节点属性 在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType ...
- JS DOM对象控制HTML元素详解
JS DOM对象控制HTML元素详解 方法: getElementsByName() 获取name getElementsByTagName() 获取元素 getAttribute() 获取元素 ...
- Struts2使用Interceptor实现权限控制的应用实例详解
Struts2使用Interceptor实现权限控制的应用实例详解 拦截器:是Struts2框架的核心,重点之重.因此,对于我们要向彻底学好Struts2.0.读源码和使用拦截器是必不可少的.少说了. ...
- C#依赖注入控制反转IOC实现详解
原文:C#依赖注入控制反转IOC实现详解 IOC的基本概念是:不创建对象,但是描述创建它们的方式.在代码中不直接与对象和服务连接,但在配置文件中描述哪一个组件需要哪一项服务.容器负责将这些联系在一起. ...
- C#类、对象、方法和属性详解
C#类.对象.方法和属性详解 一.相关概念: 1.对象:现实世界中的实体(世间万物皆对象) 2.类:具有相似属性和方法的对象的集合 3.面向对象程序设计的特点:封装 继承 多态 4.对象的三要素:属性 ...
- JS总结之二:DOM对象控制HTML
DOM对象控制HTML 1.方法 getElementsByName( ) ——获取name getElementsByTagName( ) ——获取元素 getAttribute( ) ——获取元素 ...
- JavaScript 对象、DOM对象、jquery对象的区别、转换详解
一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...
- 18.C++-[ ]操作符使用 、函数对象与普通函数区别(详解)
在上章17.C++-string字符串类(详解)学习了string类,发现可以通过[ ]重载操作符来访问每个字符. 比如: string s="SAD"; for(int i=0, ...
随机推荐
- 京东集团副总裁李大学:像CEO一样思考 - Dancen的专栏 - 博客频道 - CSDN.NET
京东集团副总裁李大学:像CEO一样思考 - Dancen的专栏 - 博客频道 - CSDN.NET 京东集团副总裁李大学:像CEO一样思考
- 去除 Visual Studio 中臃肿的 ipch 和 sdf 文件
使用VS2010建立C++解决方案时,会生成SolutionName.sdf和一个叫做ipch的文件夹,这两个文件再加上*.pch等文件使得工程变得非常的庞大,一个简单的程序都会占用几十M的硬盘容量, ...
- java对Ldap操作2
package ldap.pojo;import java.util.List;/** * @author 张亮 * ldap用户属性信息数据类 */public class LdapPersonI ...
- poj 1789 Truck History【最小生成树prime】
Truck History Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 21518 Accepted: 8367 De ...
- java对文件拷贝的简单操作
package fileInputStream; import java.io.File; import java.io.FileInputStream; import java.io.FileNot ...
- 银联手机支付(.Net Csharp),3DES加密解密,RSA加密解密,RSA私钥加密公钥解密,.Net RSA 3DES C#
前段时间做的银联支付,折腾了好久,拼凑的一些代码,有需要的朋友可以参考,本人.Net新手,不保证准确性! 这个银联手机支付没有SDK提供,技术支持也没有.Net的,真心不好搞! RSA加解密,这里有个 ...
- 配置java软件
到官网下载了jdk和jre的安装包 配置时发现javac显示 "javac不是内部或外部命令,等等一些的问题" 上百度搜索后,发现是win10系统配置path的时候需要写绝对路径而 ...
- winform中DataGridView的数据实现导出excel
1,窗体设计 首先需要引入程序集:Microsoft.Office.Interop.Excel (如果没有引用过的需要右键添加引用再搜索就行了) 实现的方法: /// <summary> ...
- ELK监控系统nginx / mysql慢日志
ELK监控系统nginx / mysql慢日志 elasticsearch logstash kibana ELK监控系统nginx日志 1.环境准备 centos6.8_64 mini IP:192 ...
- (转)LINUX的端口和服务
一.端口和服务的关系 端口号与相应服务的对应关系存放在/etc/services文件中,这个文件中可以找到大部分端口.使用netstat命令显示的服务名称也是从这个文件中找的.有人说将这个文件中的相应 ...