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


Posted in Javascript onMarch 04, 2015

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 相关文章推荐
window.location.hash 使用说明
Nov 08 Javascript
Javascript延迟执行实现方法(setTimeout)
Dec 30 Javascript
基于mootools 1.3框架下的图片滑动效果代码
Apr 22 Javascript
javascript object array方法使用详解
Dec 03 Javascript
二叉树先序遍历的非递归算法具体实现
Jan 09 Javascript
javascript检测浏览器的缩放状态实现代码
Sep 28 Javascript
jquery获取所有选中的checkbox实现代码
May 26 Javascript
js鼠标经过tab选项卡时实现切换延迟
Mar 24 Javascript
jquery获取file表单选择文件的路径、名字、大小、类型
Jan 18 jQuery
JS页面获取 session 值,作用域和闭包学习笔记
Oct 16 Javascript
js实现简单掷骰子小游戏
Oct 24 Javascript
Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】
May 13 Javascript
深入理解JavaScript系列(50):Function模式(下篇)
Mar 04 #Javascript
深入探讨javascript中的数据类型
Mar 04 #Javascript
深入理解JavaScript系列(49):Function模式(上篇)
Mar 04 #Javascript
js实现百度联盟中一款不错的图片切换效果完整实例
Mar 04 #Javascript
jQuery中大家不太了解的几个方法
Mar 04 #Javascript
深入理解JavaScript系列(48):对象创建模式(下篇)
Mar 04 #Javascript
js计算德州扑克牌面值的方法
Mar 04 #Javascript
You might like
常用的php对象类型判断
2008/08/27 PHP
PHP define函数的使用说明
2008/08/27 PHP
smarty模板引擎中自定义函数的方法
2015/01/22 PHP
PHP中关于php.ini参数优化详解
2020/02/28 PHP
载入进度条 效果
2006/07/08 Javascript
解放web程序员的输入验证
2006/10/06 Javascript
JQuery 表单中textarea字数限制实现代码
2009/12/07 Javascript
Prototype源码浅析 Enumerable部分之each方法
2012/01/16 Javascript
解析JSON对象与字符串之间的相互转换
2013/12/18 Javascript
防止jQuery ajax Load使用缓存的方法小结
2014/02/22 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
2015/03/18 Javascript
jQuery实现首页顶部可伸缩广告特效代码
2015/04/15 Javascript
JavaScript包装对象使用详解
2015/07/09 Javascript
jquery 无限极下拉菜单的简单实例(精简浓缩版)
2016/05/31 Javascript
Chrome浏览器的alert弹窗禁止再次弹出后恢复的方法
2016/12/30 Javascript
vue.js动态数据绑定学习笔记
2017/05/19 Javascript
JavaScript实现随机五位数验证码
2019/09/27 Javascript
[01:01:01]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第一场 10.29
2020/10/29 DOTA
python的正则表达式re模块的常用方法
2013/03/09 Python
python中pandas.DataFrame的简单操作方法(创建、索引、增添与删除)
2017/03/12 Python
解决Python3 被PHP程序调用执行返回乱码的问题
2019/02/16 Python
Django如何开发简单的查询接口详解
2019/05/17 Python
pyqt5 实现 下拉菜单 + 打开文件的示例代码
2019/06/20 Python
Python实现网页截图(PyQT5)过程解析
2019/08/12 Python
Python中IP地址处理IPy模块的方法
2019/08/16 Python
PyTorch的Optimizer训练工具的实现
2019/08/18 Python
利用Python复制文件的9种方法总结
2019/09/02 Python
pyhton中__pycache__文件夹的产生与作用详解
2019/11/24 Python
美国Randolph太阳镜官网:美国制造的飞行员太阳镜和射击眼镜
2018/06/15 全球购物
经典c++面试题五
2014/12/17 面试题
.NET常见笔试题集
2012/12/01 面试题
JAVA软件工程师测试题
2014/07/25 面试题
学生会副主席竞聘书
2014/03/31 职场文书
公司活动总结范文
2014/07/01 职场文书
高三复习计划
2015/01/19 职场文书
春节晚会开场白
2015/05/29 职场文书