这篇文章主要介绍了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. C 计算金额

    #include <stdio.h> int main(int argc, char **argv) { \\定义两个变量 a金额 z跟票面 int a=0; int z=0;\\ 输入金 ...

  2. linux学习总结-----web前端①

    <html> <head> <title></title> <meta charset='utf-8'/> ... </head> ...

  3. virsh查看迁移信息的两个命令

    virsh qemu-monitor-command uuid --hmp info migrate, 能看到迁移所设置的相关参数,和进度相关信息: virsh domjobinfo uuid命令, ...

  4. LeetCode 19——删除链表的倒数第 N 个节点

    1. 题目 给定一个链表,删除链表的倒数第 n 个节点,并且返回链表的头结点. 示例: 给定一个链表: 1->2->3->4->5, 和 n = 2. 当删除了倒数第二个节点后 ...

  5. Week2 Teamework from Z.XML 软件分析与用户需求调查(五)从对比中看见必应助手发展空间

    本文将主要探讨软件功能前景(浮动头像界面,升级式角色),找出与bing助手相类似功能的资深软件,分析这些软件的发展趋势和用户体验,从历史的角度来评测bing助手的某些功能的前景. 1.浮动头像界面-曲 ...

  6. Hadoop世界中的HelloWorld之WordCount具体分析

    MapReduce 应用举例:单词计数 WorldCount可以说是MapReduce中的helloworld了,下面来看看hadoop中的例子worldcount对其进行的处理过程,也能对mapre ...

  7. WCF 透明代理

    现在我们通过类似的原理创建一个用于模拟WCF服务端和客户端工作原理的模拟程序.[源代码从这里下载] 目录 一.基本的组件和执行流程 二.创建自定义HttpHandler实现对服务调用请求的处理 三.定 ...

  8. Map.Entry遍历Map

    Map.entry是Java中的一个接口.每一个Map.entry代表一个map对象. 可以通过 Map是java中的接口,Map.Entry是Map的一个内部接口,它表示map中的一个实体(及一个k ...

  9. chrome & dark theme

    chrome & dark theme Dark Reader Extensions https://darkreader.org/help/en/ https://chrome.google ...

  10. ashx文件和aspx

    ashx文件和aspx文件有什么不同? 我们先新建一个ashx文件看看: <%@ WebHandler Language="C#" Class="Handler&q ...