需要做特殊处理的DOM元素属性的访问


Posted in Javascript onNovember 05, 2010
var props = { 
'for' : 'htmlFor', 

'class': 'className', 

readonly: 'readOnly', 

maxlength: 'maxLength', 

cellspacing: 'cellSpacing', 

rowspan: 'rowSpan', 

colspan: 'colSpan', 

tabindex: 'tabIndex', 

usemap: 'useMap', 

frameborder: 'frameBorder' 
}

说点题外话,用json格式来创建对象的话,建议属性不需要单引号或者双引号,除非一些ecmascript的关键词,比如上面的'for','class'等,建议平时还是用
单引号,到不是说单引号一定就比双引号更好,更符合规范,但是一种习惯还是很重要的,不要在代码中即出现单引号又出现双引号的。
举个简单的例子:
<label for="username" id="test">name:</label><BR><input type="text" id="username" name="username"/><BR>

假如你想直接通过elem.propertyName这样的访问方式来得到某个DOM元素的某个属性值,对于上面的属性访问你就必须做个简单的变化,

例如上面的这个例子,你想得到label的for属性值。

var ele = document.getElementById('test'); 
var val = ele.htmlFor; 
//或者 
val = ele['htmlFor']; 
//通过标准的DOM方法访问的话,就不需要做特殊处理了 
val = ele.getAttribute('for'); 
val = ele.getAttributeNode('for').value;

同样对于class,readonly等的访问,上面的几种访问方式也一样适合。

个人觉得直接通过属性访问或许会比通过DOM方法访问要快些。
下面的文章会再对特殊属性的访问做介绍。

Javascript 相关文章推荐
吐槽一下我所了解的Node.js
Oct 08 Javascript
js判断某个方法是否存在实例代码
Jan 10 Javascript
js提交form表单,并传递参数的实现方法
May 25 Javascript
jQuery实现区域打印功能代码详解
Jun 17 Javascript
jQuery读取XML文件的方法示例
Feb 03 Javascript
javascript 操作cookies详解及实例
Feb 22 Javascript
Bootstrap 表单验证formValidation 实现远程验证功能
May 17 Javascript
webpack打包并将文件加载到指定的位置方法
Feb 22 Javascript
vue.js element-ui tree树形控件改iview的方法
Mar 29 Javascript
微信小程序6位或多位验证码密码输入框功能的实现代码
May 29 Javascript
解决layui轮播图有数据不显示的情况
Sep 16 Javascript
jQuery操作元素的内容和样式完整实例分析
Jan 10 jQuery
基于jQuery的仿flash的广告轮播
Nov 05 #Javascript
jquery实现文本框鼠标右击无效以及不能输入的代码
Nov 05 #Javascript
基于jquery的loading效果实现代码
Nov 05 #Javascript
解决jQuery插件tipswindown与hintbox冲突
Nov 05 #Javascript
Jquery数独游戏解析(一)-页面布局
Nov 05 #Javascript
TinyMCE 新增本地图片上传功能
Nov 05 #Javascript
jQuery示例收集
Nov 05 #Javascript
You might like
PHP+javascript液晶时钟
2006/10/09 PHP
深入array multisort排序原理的详解
2013/06/18 PHP
最常用的8款PHP调试工具
2014/07/06 PHP
php实现将Session写入数据库
2015/07/26 PHP
php实现HTML实体编号与非ASCII字符串相互转换类实例
2016/11/02 PHP
php 判断页面或图片是否经过gzip压缩的方法
2017/04/05 PHP
javaScript对象和属性的创建方法
2007/01/15 Javascript
图像替换新技术 状态域方法
2010/01/28 Javascript
jQuery层次选择器选择元素使用介绍
2013/04/18 Javascript
js实现PC端和移动端刮卡效果
2020/03/27 Javascript
Angular2入门教程之模块和组件详解
2017/05/28 Javascript
JavaScript 有用的代码片段和 trick
2018/02/22 Javascript
react-native封装插件swiper的使用方法
2018/03/20 Javascript
基于vue-router 多级路由redirect 重定向的问题
2018/09/03 Javascript
基于vue中keep-alive缓存问题的解决方法
2018/09/21 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
2018/10/31 Javascript
详解webpack+ES6+Sass搭建多页面应用
2018/11/05 Javascript
解决Vue在封装了Axios后手动刷新页面拦截器无效的问题
2018/11/08 Javascript
Nuxt.js的路由跳转操作(页面跳转nuxt-link)
2020/11/06 Javascript
使用python绘制人人网好友关系图示例
2014/04/01 Python
使用python实现拉钩网上的FizzBuzzWhizz问题示例
2014/05/05 Python
Python用threading实现多线程详解
2017/02/03 Python
用Q-learning算法实现自动走迷宫机器人的方法示例
2019/06/03 Python
ZABBIX3.2使用python脚本实现监控报表的方法
2019/07/02 Python
python检查目录文件权限并修改目录文件权限的操作
2020/03/11 Python
Django Xadmin多对多字段过滤实例
2020/04/07 Python
Python函数参数定义及传递方式解析
2020/06/10 Python
Python tkinter界面实现历史天气查询的示例代码
2020/08/23 Python
详解Python中第三方库Faker
2020/09/25 Python
HTML5 video 事件应用示例
2014/09/11 HTML / CSS
英国办公家具网站:Furniture At Work
2019/10/07 全球购物
儿子婚宴答谢词
2014/01/09 职场文书
三严三实对照检查材料
2014/08/25 职场文书
党员“四风”问题批评与自我批评思想汇报
2014/10/06 职场文书
三八妇女节寄语
2015/02/27 职场文书
CSS 文字装饰 text-decoration & text-emphasis 详解
2021/04/06 HTML / CSS