JavaScript中的 attribute 和 jQuery中的 attr 方法浅析


Posted in Javascript onJanuary 04, 2017

根据大体上的意思我感觉js setAttribute与jquery中attr工作是完全一样的,只是jquery中简写了并且工能更强大了,下面我来分别介绍一下他们的用法。

attribute 是原生js dom 对象上的一个属性,这个属性有很多子属性,比如 isId(判断属性是否是Id) , name (获取属性名称) , value (获取属性值),attributes 用来获取dom元素 的所有属性集合。

话不多说,上例子了:

<input type="text" name="username" id="name" verify="len_2_12" >
<script>
  var oInput = document.getElementsByTagName("INPUT")[0] ;
  var attrs  = oInput.attributes;
  var attr   = attrs[0];
</script>

attrs 中就包含 input 所有的属性 有 type,name,id,verify(自己加的属性,表单验证的时候用到,不影响input功能);

attr 只是type="text"。

attr.name = "type"
attr.value = "text"

jquery 获取元素的属性非常简单,选取元素后直接使用attr('属性名称')方法就可以获取属性值,attr('属性名称',属性值);可以设置元素属性

以上所述是小编给大家介绍的JavaScript中的 attribute 和 jQuery中的 attr 方法浅析,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js预载入和JavaScript Image()对象使用介绍
Aug 28 Javascript
jquery获取checkbox的值并post提交
Jan 14 Javascript
详解JavaScript编程中正则表达式的使用
Oct 25 Javascript
详解AngularJS中自定义过滤器
Dec 28 Javascript
JS基于面向对象实现的拖拽功能示例
Dec 20 Javascript
javaScript生成支持中文带logo的二维码(jquery.qrcode.js)
Jan 03 Javascript
jquery单击文字或图片内容放大并居中显示
Jun 23 jQuery
js解决软键盘遮挡输入框的问题分享
Dec 19 Javascript
layui自定义验证,用ajax查询后台是否有重复数据,form.verify的例子
Sep 06 Javascript
JS实现移动端双指缩放和旋转方法
Dec 13 Javascript
js实现QQ邮箱邮件拖拽删除功能
Aug 27 Javascript
vue中watch的用法汇总
Dec 28 Vue.js
快速实现JS图片懒加载(可视区域加载)示例代码
Jan 04 #Javascript
基于jQuery实现选项卡效果
Jan 04 #Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
Jan 04 #Javascript
JavaScript原生编写《飞机大战坦克》游戏完整实例
Jan 04 #Javascript
jQuery实现联动下拉列表查询框
Jan 04 #Javascript
JavaScript中String对象的方法介绍
Jan 04 #Javascript
js select下拉联动 更具级联性!
Apr 17 #Javascript
You might like
PHP加密扩展库Mcrypt安装和实例
2013/11/10 PHP
PHP删除数组中空值的方法介绍
2014/04/14 PHP
浅析php创建者模式
2014/11/25 PHP
ThinkPHP like模糊查询,like多匹配查询,between查询,in查询,一般查询书写方法
2018/09/26 PHP
解决windows上php xdebug 无法调试的问题
2020/02/19 PHP
Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)
2013/04/02 Javascript
javascript之typeof、instanceof操作符使用探讨
2013/05/19 Javascript
JavaScript实现检查页面上的广告是否被AdBlock屏蔽了的方法
2014/11/03 Javascript
jquery实现多屏多图焦点图切换特效的方法
2015/05/04 Javascript
jQuery的bind()方法使用详解
2015/07/15 Javascript
jQuery实现的淡入淡出二级菜单效果代码
2015/09/15 Javascript
javascript学习小结之prototype
2015/12/03 Javascript
jQuery EasyUI datagrid在翻页以后仍能记录被选中行的实现代码
2016/08/15 Javascript
jQuery简单实现中间浮窗效果
2016/09/04 Javascript
TypeScript入门-基本数据类型
2017/03/28 Javascript
js提取中文拼音首字母的封装工具类
2018/03/12 Javascript
vue使用ajax获取后台数据进行显示的示例
2018/08/09 Javascript
angular5 子组件监听父组件传入值的变化方法
2018/09/30 Javascript
vue中轮训器的使用
2019/01/27 Javascript
Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】
2020/05/13 Javascript
JavaScript封装单向链表的示例代码
2020/09/17 Javascript
Python os模块介绍
2014/11/30 Python
python中字典(Dictionary)用法实例详解
2015/05/30 Python
python将每个单词按空格分开并保存到文件中
2018/03/19 Python
python3正则提取字符串里的中文实例
2019/01/31 Python
Python3 pandas 操作列表实例详解
2019/09/23 Python
pip install python 快速安装模块的教程图解
2019/10/08 Python
利用css3画个同心圆示例代码
2017/07/03 HTML / CSS
HTML5 Web存储方式的localStorage和sessionStorage进行数据本地存储案例应用
2012/12/09 HTML / CSS
澳洲小众品牌的集合网站:BNKR
2018/02/23 全球购物
The North Face北面德国官网:美国著名户外品牌
2018/12/12 全球购物
Hawes & Curtis官网:英国经典品牌
2019/07/27 全球购物
《菜园里》教学反思
2014/04/17 职场文书
2014年销售工作总结
2014/12/01 职场文书
简爱电影观后感
2015/06/10 职场文书
openstack云计算keystone组件工作介绍
2022/04/20 Servers