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 相关文章推荐
javascript 写类方式之五
Jul 05 Javascript
基于jquery的仿百度的鼠标移入图片抖动效果
Sep 17 Javascript
JQuery为页面Dom元素绑定事件及解除绑定方法
Apr 23 Javascript
js完美解决IE6不支持position:fixed的bug
Apr 24 Javascript
原生javascript 学习之js变量全面了解
Jul 14 Javascript
jQuery实现简洁的轮播图效果实例
Sep 07 Javascript
Bootstrap缩略图与警告框学习使用
Feb 08 Javascript
jquery实现tab键进行选择后enter键触发click行为
Mar 29 jQuery
jQuery Validate 无法验证 chosen-select元素的解决方法
May 17 jQuery
JavaScript基础心法 数据类型
Mar 05 Javascript
HTML元素拖拽功能实现的完整实例
Dec 04 Javascript
vue动态设置路由权限的主要思路
Jan 13 Vue.js
深入理解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
基于PHP5魔术常量与魔术方法的详解
2013/06/13 PHP
php打造智能化的柱状图程序,用于报表等
2015/06/19 PHP
用PHP将Unicode 转化为UTF-8的实现方法(推荐)
2017/02/08 PHP
如何实现浏览器上的右键菜单
2006/07/10 Javascript
splice slice区别
2006/10/09 Javascript
jQuery效果 slideToggle() 方法(在隐藏和显示之间切换)
2011/06/28 Javascript
jQuery实现的fixedMenu下拉菜单效果代码
2015/08/24 Javascript
悬浮广告方法日常收集整理
2016/03/18 Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
2017/04/26 Javascript
微信小程序图片选择区域裁剪实现方法
2017/12/02 Javascript
nginx+vue.js实现前后端分离的示例代码
2018/02/12 Javascript
新版vue-cli模板下本地开发环境使用node服务器跨域的方法
2018/04/03 Javascript
如何自动化部署项目?折腾服务器之旅~
2019/04/16 Javascript
详解Vue依赖收集引发的问题
2019/04/22 Javascript
element-ui 中使用upload多文件上传只请求一次接口
2019/07/19 Javascript
Vue中使用Lodop插件实现打印功能的简单方法
2019/12/19 Javascript
浅析我对JS延迟异步脚本的思考
2020/10/12 Javascript
EXTJS7实现点击拖拉选择文本
2020/12/17 Javascript
[01:01:31]2018DOTA2亚洲邀请赛3月29日小组赛B组 Mineski VS paiN
2018/03/30 DOTA
学习python之编写简单乘法口诀表实现代码
2016/02/27 Python
简单的python后台管理程序
2017/04/13 Python
python 随机打乱 图片和对应的标签方法
2018/12/14 Python
劳力士官方珠宝商:J.R. Dunn Jewelers
2018/09/29 全球购物
Antonioli美国在线商店:时尚前卫奢华
2019/07/29 全球购物
杭州龙健科技笔试题.net部分笔试题
2016/01/24 面试题
《最大的麦穗》教学反思
2014/04/17 职场文书
保护环境演讲稿
2014/05/10 职场文书
学校国庆节活动总结
2015/03/23 职场文书
护士长2015年终工作总结
2015/04/24 职场文书
培训讲师开场白
2015/06/01 职场文书
董事会决议范本
2015/07/01 职场文书
学子宴致辞大全
2015/07/27 职场文书
2019最新版火锅店的创业计划书 !
2019/07/12 职场文书
使用css样式设计一个简单的html登陆界面的实现
2021/03/30 HTML / CSS
Go语言基础知识点介绍
2021/07/04 Golang
《艾尔登法环》Boss腐烂树灵很有可能是《黑暗之魂3》的一个废案
2022/04/11 其他游戏