jQuery.prop() 与attr()
1.attr()
是jQuery 1.0版本就有的函数,prop()
是jQuery 1.6版本新增的函数。毫无疑问,在1.6之前,你只能使用attr()
函数;1.6及以后版本,你可以根据实际需要选择对应的函数。
2.在jQuery中,prop()
函数的设计目标是用于设置或获取指定DOM元素(指的是JS对象,Element类型)上的属性(property);attr()
函数的设计目标是用于设置或获取指定DOM元素所对应的文档节点上的属性(attribute)。
3.在jQuery 1.6之前,只有attr()
函数可用,该函数不仅承担了attribute的设置和获取工作,还同时承担了property的设置和获取工作。例如:在jQuery 1.6之前,attr()
也可以设置或获取tagName、className、nodeName、nodeType等DOM元素的property。
直到jQuery 1.6新增prop()
函数,并用来承担property的设置或获取工作之后,attr()
才只用来负责attribute的设置和获取工作。
此外,对于表单元素的checked
、selected
、disabled
等属性,在jQuery 1.6之前,attr()
获取这些属性的返回值为Boolean类型:如果被选中(或禁用)就返回true
,否则返回false
。
但是从1.6开始,使用attr()
获取这些属性的返回值为String类型,如果被选中(或禁用)就返回checked
、selected
或disabled
,否则(即元素节点没有该属性)返回undefined
。并且,在某些版本中,这些属性值表示文档加载时的初始状态值,即使之后更改了这些元素的选中(或禁用)状态,对应的属性值也不会发生改变。
因为jQuery认为:attribute的checked
、selected
、disabled
就是表示该属性初始状态的值,property的checked
、selected
、disabled
才表示该属性实时状态的值(值为true
或false
)。
4.selectedIndex,tagName
,nodeName
,nodeType
,ownerDocument
,defaultChecked
,和defaultSelected应该被使用.prop()方法获取和设置。在jQuery1.6版本之前,这些properties是通过.attr()方法获取的,
<div id="n1">
<p id="n2" class="demo test" data-key="UUID" data_value="1235456465">CodePlayer</p>
<input id="n3" name="order_id" type="checkbox" value="1">
<input id="n4" name="order_id" type="checkbox" checked="checked" value="2">
</div>
var
$n2 = $(
"#n2"
);
// prop()操作针对的是元素(Element对象)的属性,而不是元素节点(HTML文档)的属性
document.writeln( $n2.prop(
"data-key"
) );
// undefined
document.writeln( $n2.prop(
"data_value"
) );
// undefined
document.writeln( $n2.prop(
"id"
) );
// n2
document.writeln( $n2.prop(
"tagName"
) );
// P
document.writeln( $n2.prop(
"className"
) );
// demo test
document.writeln( $n2.prop(
"innerHTML"
) );
// CodePlayer
document.writeln(
typeof
$n2.prop(
"getAttribute"
) );
// function
// 以对象形式同时设置多个属性,属性值可以是对象、数组等任意类型
$n2.prop( {
prop_b:
"baike"
,
prop_c: 18,
} );
$msg.prop("className", "newTest");
// 修改className(property)导致class(attitude)也随之更改
w( $msg.attr("class") ); // newTest
jQuery.prop() 与attr()的更多相关文章
- JQUERY prop与attr差额
1. 1-9-1之前和之后之间的差 <html> <script src="Js/jquery-1.9.0.js" type="text/javasc ...
- jquery prop和attr的区别
jquery1.6中新加了一个方法prop(),一直没用过它,官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值. 大家都知道有的浏览器只要写disabled,checked就可以了,而有的 ...
- jquery prop and attr
http://www.javascript100.com/?p=877 http://blog.sina.com.cn/s/blog_655388ed01017cnc.html http://www. ...
- jQuery学习之prop和attr的区别示例介绍
1..prop( propertyName ) 获取匹配集合中第一个元素的Property的值 2. .prop( propertyName, value ) .prop( map ) .prop( ...
- jQuery的prop和attr方法之间区别
JQuery.attr(): Get the value of an attribute for the first element in the set of matched elements. J ...
- jquery的prop()和attr()
jQuery1.6以后prop()和attr()的应用场景如下: 第一原则:只添加属性名称该属性就会立即生效应该使用prop(); 第二原则:只存在true/false的属性应该使用prop(); 设 ...
- 【Jquery】prop与attr的差别
近期因项目须要用到复选框,当中一个控制全选. // 全选 $(".ckb_all").click(function(){ if($(this).attr("checked ...
- 【Jquery系列】prop和attr区别
问题描述 由于prop(property的缩写)和attr(attribute的缩写)翻译成汉语,均有“特性.属性”等意思的原因,导致大家容易混淆分不清,本篇文章将试图从英文含义,中文含义和Jquer ...
- jQuery 选择器 prop() 和attr()
Day30 jQuery 1.1.1.1 什么是jQuery? n jQuery是javaScript的前端框架.对常见的对象和常用的方法进行封装,使用更方便. 它兼容CSS3,还兼容各种浏览器.文档 ...
随机推荐
- include和application
include指令 语法:<%@ include file=”路径+文件名” %> 把指定的文件包含到当前jsp中. application(应用的全局变量) 实现用户之间的数据共享 常 ...
- Android 进阶13:几种进程通信方式的对比总结
不花时间打基础,你将会花更多时间解决那些不必要的问题. 读完本文你将了解: RPC 是什么 IDL 是什么 IPC 是什么 Android 几种进程通信方式 如何选择这几种通信方式 Thanks RP ...
- Android tcpdump 使用
/************************************************************************** * Android tcpdump 使用 * 说 ...
- Thinking in Java 4th(Java编程思想第四版)文档、源码、习题答案
Thinking in Java 4th 中.英文两版pdf文档,书中源码及课后习题答案.链接:https://pan.baidu.com/s/1BKJdtgJ3s-_rN1OB4rpLTQ 密码:2 ...
- Spring源码学习之:ClassLoader学习(5)-自测
[一]测试目的(ClassLoader的作用) 1:测试涉及三个jar包,nonbankcard-configure-0.0.1-SNAPSHOT.jar,nonbankcard-persist-0. ...
- Git克隆、修改、更新项目,及查看项目地址命令
第一步:在本地新建一个文件夹,作为本地仓库,如“texzt”,直接打开该文件夹,并单击右键,选择git bash here 则可以直接进入到该文件夹目录下. 第二步:将本地仓库初始化,命令:git i ...
- 限制UITextfield的输入字符为50个字符
1.实现UITextfieldDelegate 2.在UITextfield的代理方法中判断添加字符还是删除字符,从而做不同的操作 #pragma mark-UITextfield的代理方法 - (B ...
- SpringMVC集成rabbitMQ
Maven引入相关jar <dependency> <groupId>com.rabbitmq</groupId> <artifactId>amqp-c ...
- Mouse without Borders 跨屏鼠标
Mouse without Borders 跨屏鼠标 软件方式 当你有几台电脑同时工作时,不停的换鼠标和键盘是非常不方便的. 如果用的 Mouse without Borders 就不一样了,可以在多 ...
- windows下通过Git Bash使用Git常用命令
Git跟SVN最大不同的地方就是分布式.SVN的集中式与Git的分布式决定各自的业务场景.既然是分布式的,那么大部分操作就是本地操作.一般Git操作都是通过IDE,比如Eclipse,如果装了Git ...