需要做特殊处理的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 相关文章推荐
event对象的方法 兼容多浏览器
Jun 27 Javascript
让人期待的2011年度最佳 jQuery 插件分享
Mar 16 Javascript
Javascript核心读书有感之类型、值和变量
Feb 11 Javascript
javascript 动态创建表格的2种方法总结
Mar 04 Javascript
JavaScript获取网页支持表单字符集的方法
Apr 02 Javascript
Bootstrap每天必学之面板
Nov 30 Javascript
js获取及判断键盘按键的方法
Dec 01 Javascript
AngularJS入门教程之控制器详解
Jul 27 Javascript
Vue实例简单方法介绍
Jan 20 Javascript
vue webpack打包优化操作技巧
Feb 22 Javascript
一文快速详解前端框架 Vue 最强大的功能
May 21 Javascript
Vue项目中使用mock.js的完整步骤
Jan 12 Vue.js
基于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
用mysql内存表来代替php session的类
2009/02/01 PHP
解析如何在PHP下载文件名中解决乱码的问题
2013/06/20 PHP
解析php file_exists无效的解决办法
2013/06/26 PHP
Laravel核心解读之异常处理的实践过程
2019/02/24 PHP
php中isset与empty函数的困惑与用法分析
2019/07/05 PHP
PDO实现学生管理系统
2020/03/21 PHP
JavaScript实际应用:innerHTMl和确认提示的使用
2006/06/22 Javascript
基于jQuery图片平滑连续滚动插件
2009/04/27 Javascript
jQuery UI Datepicker length为空或不是对象错误的解决方法
2010/12/19 Javascript
JavaScript 产生不重复的随机数三种实现思路
2012/12/13 Javascript
JS实现表格数据各种搜索功能的方法
2015/03/03 Javascript
JavaScript数据推送Comet技术详解
2016/04/07 Javascript
jQuery分页插件jquery.pagination.js使用方法解析
2017/02/09 Javascript
详解JS获取HTML DOM元素的8种方法
2017/06/17 Javascript
手淘flexible.js框架使用和源代码讲解小结
2018/10/15 Javascript
React 源码中的依赖注入方法
2018/11/07 Javascript
跨域解决之JSONP和CORS的详细介绍
2018/11/21 Javascript
简单实现vue中的依赖收集与响应的方法
2019/02/18 Javascript
el-input 标签中密码的显示和隐藏功能的实例代码
2019/07/19 Javascript
Angular8引入百度Echarts进行图表分析的实现代码
2019/11/27 Javascript
深入解析微信小程序开发中遇到的几个小问题
2020/07/11 Javascript
微信小程序实现加入购物车滑动轨迹
2020/11/18 Javascript
CentOS 8.2服务器上安装最新版Node.js的方法
2020/12/16 Javascript
爬山算法简介和Python实现实例
2014/04/26 Python
python使用Apriori算法进行关联性解析
2017/12/21 Python
详解Python字符串切片
2019/05/20 Python
Python的log日志功能及设置方法
2019/07/11 Python
django写用户登录判定并跳转制定页面的实例
2019/08/21 Python
python日期与时间戳的各种转换示例
2020/02/12 Python
Python实现快速大文件比较代码解析
2020/09/04 Python
Python3.7安装PyQt5 运行配置Pycharm的详细教程
2020/10/15 Python
app内嵌H5 webview 本地缓存问题的解决
2020/10/19 HTML / CSS
公司员工离职证明书
2014/10/04 职场文书
三下乡个人总结
2015/03/04 职场文书
农业项目投资意向书
2015/05/09 职场文书
基于PyQT5制作一个桌面摸鱼工具
2022/02/15 Python