这篇文章主要介绍了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. Qt 实现脉搏检测-1-心跳曲线部分

    最新的想法就是写一个显示脉搏的东西,主要就是通过串口读取硬件(检测心跳的)传来的数据,在显示一下. 先实现画心跳曲线 如下图 先来电干货, 首先,在这个代码中,第一次用到了list这个东东 所以,关于 ...

  2. LeetCode 21 ——合并两个有序链表

    1. 题目 2. 解答 新建一个带有哨兵结点的链表,依次比较两个有序链表的结点值,将较小值的结点插入到新链表后面.直到其中一个比较完毕,将另一个链表剩余的结点全部放到新链表最后面即可.最后,可以删除哨 ...

  3. postgres(pl/pgsql)

    复制后期看 https://www.cnblogs.com/stephen-liu74/archive/2012/06/06/2312759.html https://www.cnblogs.com/ ...

  4. Mac上基于hexo+GitHub搭建个人博客(一)

    原文地址: http://fanjiajia.cn/2018/11/23/Mac%E4%B8%8A%E5%9F%BA%E4%BA%8Ehexo+GitHub%E6%90%AD%E5%BB%BA%E4% ...

  5. windows下 eclipse搭建spark java编译环境

    环境: win10 jdk1.8 之前有在虚拟机或者集群上安装spark安装包的,解压到你想要放spark的本地目录下,比如我的目录就是D:\Hadoop\spark-1.6.0-bin-hadoop ...

  6. 文件系统之 stat与access

    stat命令 stat既有命令也有同名函数,用来获取文件Inode里主要信息,所以stat命令的输出信息比ls命令的输出信息要更详细,stat 跟踪符号链接,lstat不跟踪符号链接,其中会输出对应文 ...

  7. Web-Servlet处理表单

  8. qemu的配置

    qemu的配置: buildroot的配置不需要多做配置,对了,设置下生成的文件系统是rootfs.ext2 内核打开virtio qemu脚本会在后面 疑问: 1)为什么qemu启动起来之后,没有e ...

  9. hdu6097 Mindis(几何)

    题解: 这里是用解析解的做法, 我们发现如果以P和Q做椭圆,那么当椭圆与圆相切的时候,答案最优 那么方程就是这样的 联立之后,解delta等于0,可以得到 答案就是2a了 注意不一定任何情况都有解,当 ...

  10. vector 基础2

    size  :返回有效元素个数 max_size  :返回 vector 支持的最大元素个数 resize  :改变有效元素的个数 capacity  :返回当前可使用的最大元素内存块数(即存储容量) ...