浅谈attr()和prop()
attr()和prop()这两个属性的时候感觉很迷茫,而且配合官方给出的推荐使用图:
prop()可以做到的attr()完全都可以,而且做不到的attr()也可以做到。何用? 然后我就把它丢掉了。。。直到。。
今天切一个页面,在checkbox判断的方面上除了问题,就是通过jquery设置选中的时候,发现checked和disabled属性已经设置上去了,而且一旦手动点掉checked或者选中的时候,就无法再次做判断
if($('#d1').attr('disabled')!='disabled'){ alert('1') }
如果本身是存在disabled的时候,alert无法触发,本身没有disabled属性的时候才能触发,
if($('#d1').prop('disabled')!='disabled'){ alert('1') }
但是把attr()改成prop()的时候alert()就可以触发了。
还有
通过jquery的attr属性修改选中状态。我们神奇的发现,选中的状态已经变了,但是样式却没有变过来。
$("#reply1").attr("checked", true);
有些同学可能要说了,上面的代码有问题。应该是 $("#reply1").attr("checked", “checked”);
然而我们发现这并没有什么卵用。。。。于是乎我彻底凌乱了,难道是自己的问题还是自己的问题?
于是,我开始了2小时的大脑爆炸!脑子一直处于懵逼状态,最终发现,之前被我遗弃的prop()是可以
触发的。所以我得出结论---JQuery本身的问题。
所以在这里告诉大家,不是我们的错,是jquery的问题!!!
那么现在我们来重新复习一遍prop();
prop() --- JQuery 1.6版本新增属性,包含四种用法:
1,JQueryObject.prop(object);
返回属性的值
2,JQueryObject.prop(propertyName,value);
设置属性和值
3,JQueryObject.prop(property,function(index,currentvalue));
使用函数设置属性和值
4,,JQueryObject.prop(property:value,property:value,....);
设置多个属性和值
注意:
1.当该方法用于返回属性值时,则返回第一个匹配元素的值
2.当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。
prop()方法多用于检索属性值,例如(DOM属性,selectedIndex, tagName, nodeName, nodeType, ownerDocument,
defaultChecked, 和 defaultSelected);
但是检索HTML属性的时候,要使用attr()代替。
相对而言,移除属性使用相对的removeAttr()和removeProp()两种方法。
原文地址:https://www.cnblogs.com/xiaowoniulx/p/11527643.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法