这篇文章主要介绍了JavaScript设置获取和设置属性的方法,学会使用getAttribute、setAttribute的用法,需要的朋友可以参考下
 

getAttribute

该方法用来获取元素的属性,调用方式如下所示:

复制代码代码如下:
object.getAttribute(attribute)

以此前介绍的一些方法不同,getAttribute方法不属于document对象,所以不能通过document对象调用。它只能通过元素节点对象来调用。

该方法只接受一个参数,你指定要查询的属性的名字。如果指定的属性没有设置,结果将返回null对象。

setAttribute

以上面作用相反的是setAttribute,该方法被用来设置元素节点的属性。调用方式如下所示:

复制代码代码如下:
object.setAttribute(attribute)

该方法只接受一个参数,即你要设置的属性。

拓展阅读

通过setAttribute对文档做了修改之后,在通过浏览器的view source(查看源代码)选项去查看文档的源代码时看到的仍将是改变前的值,也就是说,setAttribute做出的修改不会反映在文档本身的源代码里。这种“表里不一”的现象源自DOM的工作模式:先加载文档的静态内容,在动态刷新,动态刷新不影响文档的静态内容。这正是DOM的真正威力:对页面内容进行刷新却不需要在浏览器里刷新页面。

上面的两个方法属于DOM Level 1中新增的API,在他们出现之前,可以通过另外一种方法来实现,举例如下

获取属性:

复制代码代码如下:
var val = element.attribute //获取属性

上面的等价于

复制代码代码如下:
var val = element.getAttribute('attribute');   

设置属性:

复制代码代码如下:
element.attribute = "the new value";

其等价于

复制代码代码如下:
element.setAttribute("attribute", "the new value");    

如果你想偷懒少敲键盘的话,那么推荐上面的方式,不过最佳实践还是要推崇DOM标准,即使用setAttribute和getAttribute。

JavaScript设置获取和设置属性的方法的更多相关文章

  1. Java反射学习-1 - 反射获取类的属性,方法,构造器

    新建一个Person类 package cn.tx.reflect; /** * 注解初步了解 * @author Administrator * */ public class Person { p ...

  2. JavaScript之获取和设置元素属性

    1.与我前面的随笔获取元素的那些方法不同http://www.cnblogs.com/GreenLeaves/p/5689075.html 获取元素属性的方法getAttribute()不属于docu ...

  3. jquery - 设置/获取内容和属性

    一般我们会遇到给某个元素添加或更改原有的文字: 1. 设置/获取内容 - text().html() 以及 val() 设置内容常用的三个方法: text() - 设置或返回所选元素的文本内容 htm ...

  4. javascript中获取非行间样式的方法

    我们都知道一般在javascript中获取样式一般用的是nodeObj.style.attr这个属性的,但是这个属性只能获取行间样式非行间样式比如写在样式表中的样式那么用nodeObj.style.a ...

  5. jquery获取内容和属性的方法

    通过jquery如何捕获文本内容和属性? text(),html(),val()及attr(). attr()更具有普遍性,元素text属性和表单value属性,可以通过attr()操作. <! ...

  6. JavaScript之Object对象常用属性与方法手册

    MDN Object参考地址:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Obje ...

  7. 全面理解Javascript中Function对象的属性和方法

    http://www.cnblogs.com/liontone/p/3970420.html 函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这 ...

  8. javascript中的array对象属性及方法

    Array 对象 Array 对象用于在单个的变量中存储多个值. 创建 Array 对象的语法: new Array(); new Array(size); new Array(element0, e ...

  9. javascript面向对象方式,调用属性和方法

    1.定义一个Person类,其中的属性和方法如果想对外开放,需要使用this,如: var Person=function(name,age,sex){ var psex='Boy'; if(sex) ...

随机推荐

  1. vue路由文档笔记

    引入router this.$router 和 router 使用起来完全一样.我们使用 this.$router 的原因是我们并不想在每个独立需要封装路由的组件中都导入路由 可以在任何组件内通过 t ...

  2. Go基础篇【第6篇】: 内置库模块 flag

    import "flag" flag包实现了命令行参数的解析.每个参数认为一条记录,根据实际进行定义,到一个set集合.每条都有各自的状态参数. 在使用flag时正常流程: 1.  ...

  3. MySQL初识2

    用python调用mysql的一些方法总结: 1.编码声明: # encoding: UTF-8#!/usr/bin/python 在开头处进行声明,避免出现输入中文时,提示声明错误(当然输入中文出现 ...

  4. pta结构体链表作业

    一.PTA实验作业 7-2 1. 本题PTA提交列表 2. 设计思路 题目要求按照年龄从大到小的顺序依次输出,于是我只要用冒泡法把结构体变量从大到小排列就可以了. 3.本题调试过程碰到问题及PTA提交 ...

  5. 【转】C++ const用法 尽可能使用const

    http://www.cnblogs.com/xudong-bupt/p/3509567.html C++ const 允许指定一个语义约束,编译器会强制实施这个约束,允许程序员告诉编译器某值是保持不 ...

  6. LevelDB速记

    LevelDb的基本结构如下: 由六大部分组成: 一.MemTable,用户写入和读取的直接对象, 二.Immutable MemTable,用户状态写入的对象写满的MemTable之后会转为Immu ...

  7. 使用 Redis的SETNX命令实现分布式锁

    使用Redis的 SETNX 命令可以实现分布式锁,下文介绍其实现方法. SETNX命令简介 命令格式 SETNX key value 将 key 的值设为 value,当且仅当 key 不存在. 若 ...

  8. NS10.1 产品技术规范

    NS10.1 产品技术规范 产品技术规范==================4层-7层流量管理 4层负载均衡(LB)        支持的协议TCP,UDP,FTP,HTTP,HTTPS,DNS(TC ...

  9. [洛谷P2044][NOI2012]随机数生成器

    题目大意:给你$m,a,c,X_0,n,g$,求$X_{n+1}=(a\cdot X_n+c) \bmod{m}$,最后输出对$g$取模 题解:矩阵快速幂+龟速乘,这里用了$long\;double$ ...

  10. BZOJ 2820: YY的GCD | 数论

    题目: 题解: http://hzwer.com/6142.html #include<cstdio> #include<algorithm> #define N 100000 ...