JavaScript设置获取和设置属性的方法

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。

以上就是本文的全部内容了，有需要的小伙伴来学习下，希望大家能够喜欢。

赞 (0)

相关推荐

  • javascript createElement()创建input不能设置name属性的解决方法

    其中obj.name = "select";这句话并不能起到预期的作用,无论是看生成后的HTML代码还是观察使用document.getElementsByName()获取的数组长度,都会发现这个name设置并没有起作用.当然这种情况只出现在IE6和IE7中,而在FireFox中是没有问题的. Test function addInput(){ var div = document.getElementById("testDiv"); var obj = docum

  • JavaScript cookie的设置获取删除详解

    设置cookie 每个cookie都是一个名/值对,可以把下面这样一个字符串赋值给document.cookie: document.cookie="userId=828"; 如果要一次存储多个名/值对,可以使用分号加空格(; )隔开,例如: document.cookie="userId=828; userName=hulk"; 在cookie的名或值中不能使用分号(;).逗号(,).等号(=)以及空格.在cookie的名中做到这点很容易,但要保存的值是不确定的.

  • javascript 三种方法实现获得和设置以及移除元素属性

    以下面的html为例 复制代码 代码如下: <div id="myDiv" class="bd" title="我是div"> <img id="img1" /> <a id="myA" href = "http://www.baidu.com">百度</a> </div> 1.通过HTMLElement类型(对象)的属性获得和

  • javascript学习笔记(二十) 获得和设置元素的特性（属性）

    本节html以下面的为例 复制代码 代码如下: <div id="myDiv" class="bd" title="我是div"> <img id="img1" /> <a id="myA" href = "http://www.baidu.com">百度</a> </div> 1.通过HTMLElement类型(对象)的属性获

  • 通过javascript设置css属性的代码

    1.透明度: 如果没有为一个文本指定一个背景颜色或者一个背景图像,那么这个元素的背景通常是透明的. 这一点很重要,如果一个绝对定位的且带有文本的元素放在一个有文本的元素之上,那么将会十分的混乱,那么我们就可以通过设置背景图片或者背景颜色来进行遮盖,如果必须的话我们可以将其显示的设置为"transparent"(透明的) 通用的设置透明元素通用的css如下: 复制代码 代码如下: opacity:.75;//ff new -moz-opacity:.75;// transparency

  • Javascript:为input设置readOnly属性(示例讲解)

    1.js为<input>设置readOnly属性 <textarea name="content" id="content" cols="27" rows="6"></textarea> var cObj = document.getElementById("content"); cObj.setAttribute("readOnly",'true')

  • javaScript 读取和设置文档元素的样式属性

    首先我们先说一下样式表属性 1. 内联样式即元素style属性里面设置的,级别最高 2. 页面样式表定义即页面<style></style>里面定义的,级别次之 3.外部链接样式表文件 JavaScript获取和设置文档元素的css属性: 1.获取元素Style属性里面设置的样式属性, document.getElementById(id).style.height; 有,则返回属性值:没有则返回空 IE和火狐皆然,只是有的属性值返回可能不一样,比如像颜色火狐返回rgb,而IE是返

  • Javascript设置对象的ReadOnly属性(示例代码)

    在JS中ReadOnly属性比较奇怪,直接创建一个对象,给该对象赋值readonly属性不能够向HTML中一样使用下面的方式: 复制代码 代码如下: var x=document.createElement("input");x.type="text";x.value="ttttt";x.id="xy";x.readonly="readonly"; 这样创建的对象并不是只读的.正确的写法是: 复制代码 代码

  • Javascript实现获取及设置光标位置的方法

    本文实例讲述了Javascript实现获取及设置光标位置的方法.分享给大家供大家参考.具体如下: 在项目开发中经常遇到input等设置光标位置到最后的问题,今天我查了一下Google,找到了在IE.Firefox.Opera等主流浏览器的获取光标位置(getCursortPosition)以及设置光标位置(setCursorPosition)的函数. 1. 获取光标位置函数: function getCursortPosition (ctrl) { var CaretPos = 0; // IE

  • JS获取图片lowsrc属性的方法

    本文实例讲述了JS获取图片lowsrc属性的方法.分享给大家供大家参考.具体如下: lowsrc属性一般设置为图片的低分辨率图片地址,下面的代码可以通过点击链接显示图片的低分辨率版本 <!DOCTYPE html> <html> <body> <img id="compman" src="compman.gif" lowsrc="compman_lowres.gif" alt="Computer

  • JavaScript获得表单target属性的方法

    本文实例讲述了JavaScript获得表单target属性的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html> <html> <body> <form id="frm1" action="form_action.asp" target="_blank"> First name: <input type="text" name="fnam

  • JavaScript实现获取dom中class的方法

    本文实例讲述了JavaScript实现获取dom中class的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> function getClass(node,classname) { if(node.getEle

  • JavaScript正则获取地址栏中参数的方法

    本文实例讲述了JavaScript正则获取地址栏中参数的方法.分享给大家供大家参考,具体如下: 一.问题: 获取地址栏中的参数: 若地址栏中的地址是: http://10.124.36.56:8080/CMOD/index.jsp?name=you&password=123456&type=student 要求获取地址栏中的最后一个参数type 二.实现的JS: function getAddressURLParam(paramName) { //构造一个含有目标参数的正则表达式的对象 v

  • javascript面向对象之共享成员属性与方法及prototype关键字用法

    本文实例讲述了javascript面向对象之共享成员属性与方法及prototype关键字用法.分享给大家供大家参考.具体如下: 共享成员属性与方法,使用prototype关键词 复制代码 代码如下: <script language="javascript" type="text/javascript"> function Dog(){} Dog.prototype.shout=function(){  alert("hello,小狗"

  • python打开文件并获取文件相关属性的方法

    本文实例讲述了python打开文件并获取文件相关属性的方法.分享给大家供大家参考.具体分析如下: 下面的代码通过open函数打开文件,并输出文件名.打开状态.打开模式等属性 #!/usr/bin/python # Open a file fo = open("foo.txt", "wb") print "Name of the file: ", fo.name print "Closed or not : ", fo.clos

  • JavaScript设置获取和设置属性的方法

    getAttribute 该方法用来获取元素的属性,调用方式如下所示: 复制代码 代码如下: object.getAttribute(attribute) 以此前介绍的一些方法不同,getAttribute方法不属于document对象,所以不能通过document对象调用.它只能通过元素节点对象来调用. 该方法只接受一个参数,你指定要查询的属性的名字.如果指定的属性没有设置,结果将返回null对象. setAttribute 以上面作用相反的是setAttribute,该方法被用来设置元素节点

  • 用javascript getComputedStyle获取和设置style的原理

    有兴趣的朋友搜索"百度 popup"就好了,已经有人给出了注释,强大. 最有意思的是用javascript获取和设置style DOM标准引入了覆盖样式表的概念,当我们用document.getElementById("id").style.backgroundColor 获取样式时 获取的只是id中style属性中设置的背景色,如果id中的style属性中没有设置background-color那么就会返回空,也就是说如果id用class属性引用了一个外部样式表,

  • Python中动态获取对象的属性和方法的教程

    首先通过一个例子来看一下本文中可能用到的对象和相关概念. #coding: UTF-8 import sys # 模块,sys指向这个模块对象 import inspect def foo(): pass # 函数,foo指向这个函数对象 class Cat(object): # 类,Cat指向这个类对象 def __init__(self, name='kitty'): self.name = name def sayHi(self): # 实例方法,sayHi指向这个方法对象,使用类或实例.

随机推荐