一、setAttribute() 方法

setAttribute() 方法为一个或一组元素添加指定的属性,并且为其赋指定的值。(主要针对自定义属性)

如果这个属性已经存在,仅仅设置或是修改属性值。

浏览器兼容性:所有主流浏览器都兼容

语法:

element.setAttribute(attributename,attributevalue)

参数:

attributename:添加的属性名。必需

attributevalue:添加的属性值。必需

返回值:无返回值

注意:

1、在HTML文档中的HTML元素调用 setAttribute() 方法时,该方法会将其属性名称(attribute name)参数小写。

2、如果指定的属性已经存在,就修改或是传递属性值。如果不存在,就创建指定的属性。(该方法只能通过元素节点调用)

3、不存在的属性,getAttribute() 返回 null。还是应该使用 removeAttribute() 代替 setAttribute('属性名',null)来删除属性。

实例:

setAttribute用于设置在 li元素上的属性。

     HTML     

<li>歌单</li>
<li>主播电台</li>
<li>排行榜</li>

    JavaScript    

var lis = tab_list.querySelectorAll('li');
for(var i=0;i < lis.length;i++){
lis[i].setAttribute('index',i);
}

二、getAttribute() 方法

getAttribute() 方法返回元素上一个指定的属性值。

如果指定的属性值不存在,就返回 null 或是 ""(空字符串)。

浏览器兼容:所有主流浏览器均支持 getAttribute() 方法。

语法:

element.getAttribute(attributename)

参数:

attributename:需要获得属性值的属性名称。必需

返回值:

返回指定属性的值(string类型)

注意:

1、当在HTML文档中的HTML元素中调用此方法时,getAttribute() 方法会先将参数转换为小写形式。

2、当被指定的属性不存在于元素之上是,所有浏览器都会返回 null。

3、当在被标记为 HTML 文档中的一个 HTML 元素上调用此方法时,getAttribute() 会先将其参数转换为小写形式。

4、因此,如果一个属性可能不存在于指定的元素上,在调用 getAttribute() 之前,你应该使用 element.hasAttribute() 来检测该属性是否存在。

实例:

     JavaScript     

function myFunction()
{
var a=document.getElementsByTagName("a")[0];
document.getElementById("demo").innerHTML=a.getAttribute("target");
}

其他更多自定义属性操作https://www.cnblogs.com/nyw1983/p/11817145.html

setAttribute()方法和 getAttribute() 方法的更多相关文章

  1. ServletContext结合Servlet接口中的init()方法和destroy()方法的运用----网站计数器

    我们一般知道Servlet接口中的init()方法在tomcat启动时调用,destroy()方法在tomcat关闭时调用.那么这两个方法到底在实际开发中有什么作用呢?这就是这个随笔主要讲的内容. 思 ...

  2. ASP.NET Core 中文文档 第二章 指南(4.10)检查自动生成的Detail方法和Delete方法

    原文 Examining the Details and Delete methods 作者 Rick Anderson 翻译 谢炀(Kiler) 校对 许登洋(Seay).姚阿勇(Mr.Yao) 打 ...

  3. ThinkPHP的D方法和M方法的区别

    M方法和D方法的区别 ThinkPHP 中M方法和D方法都用于实例化一个模型类,M方法 用于高效实例化一个基础模型类,而 D方法 用于实例化一个用户定义模型类. 使用M方法 如果是如下情况,请考虑使用 ...

  4. Hibernate中evict方法和clear方法说明

    Hibernate中evict方法和clear方法说明 先创建一个对象,然后调用session.save方法,然后调用evict方法把该对象清除出缓存,最后提交事务.结果报错: Exception i ...

  5. Android HTTP实例 使用GET方法和POST方法发送请求

    Android HTTP实例 使用GET方法和POST方法发送请求 Web程序:使用GET和POST方法发送请求 首先利用MyEclispe+Tomcat写好一个Web程序,实现的功能就是提交用户信息 ...

  6. virtual方法和abstract方法

    在C#的学习中,容易混淆virtual方法和abstract方法的使用,现在来讨论一下二者的区别.二者都牵涉到在派生类中与override的配合使用. 一.Virtual方法(虚方法) virtual ...

  7. JavaScript indexOf() 方法和 lastIndexOf() 方法

    一,定义和用法 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索 ...

  8. wait方法和sleep方法的区别

    一.概念.原理.区别 Java中的多线程是一种抢占式的机制而不是分时机制.线程主要有以下几种状态:可运行,运行,阻塞,死亡.抢占式机制指的是有多个线程处于可运行状态,但是只有一个线程在运行.      ...

  9. M方法和D方法的区别

    M方法和D方法的区别 ThinkPHP 中M方法和D方法都用于实例化一个模型类,M方法 用于高效实例化一个基础模型类,而 D方法 用于实例化一个用户定义模型类. 使用M方法 如果是如下情况,请考虑使用 ...

随机推荐

  1. 【Linux 网络编程】常用TCP/IP网络编程函数

    (1)函数socket /**************************************************************** ** 功能:创建一个套接字用于通信 ** 参 ...

  2. python学习笔记四 (运算符重载和命名空间、类)

    从以上代码中应该了解到: obj.attribute  查找的顺序: 从对象,类组成的树中,从下到上,从左到右到查找最近到attribute属性值,因为rec中存在name的属性,所以x.name可以 ...

  3. t-sql最短路径搜索

    SET STATISTICS IO ON; SET STATISTICS TIME ON; GO IF OBJECT_ID(N'dbo.t1') IS NOT NULL DROP TABLE dbo. ...

  4. CentOS7安装SVN1.9.12

    检查卸载原有的svn svn --version # 检查是否原有svn yum remove svn # 卸载原有svn 安装依赖: apr-1.6.5 mkdir /opt/software/sv ...

  5. 【面试向】hihoCoder 1994 树与落叶

    题目链接 Implementation int n, q; scan(n,q); vi p(n + 1); vi nson(n + 1); up (i, 1, n) { scan(p[i]); nso ...

  6. mybatis 基础(二) CRUD中的关键点

    今日学习中遇见几个问题 关于mybatis foreach的几种情况 1.当我需要传入多个参数的时候,可以将参数封装进map集合中(一般来说是针对一个对象而言的,比如user中的username,ge ...

  7. 平衡树(Splay、fhq Treap)

    Splay Splay(伸展树)是一种二叉搜索树. 其复杂度为均摊\(O(n\log n)\),所以并不可以可持久化. Splay的核心操作有两个:rotate和splay. pushup: 上传信息 ...

  8. 部署Flannel网络

    部署Flannel网络 部署flannel网络需要执行以下步骤: 1)写入分配的子网段到etcd,供flanneld使用 2)下载二进制包 3)配置Flannel 4)systemd管理Flannel ...

  9. arcgis 地图如何转到supermap平台

    场景:客户使用arcmap配置好的地图数据,由于项目需要转换到超图平台.有如下几种思路供参考. 1. 使用arcmap生成地图缓存,supermap-iServer支持发布arcgis的地图缓存以及t ...

  10. windows下xgboost安装到python

    初始环境 在安装之前,我的anaconda2已经安装好,git也有装好 下载相对应的xgboost.dll文件 下载地址 Installing the Python Wrapper for me: x ...