js中prop和attr区别
首先
- attr 是从页面搜索获得元素值,所以页面必须明确定义元素才能获取值,相对来说比较慢。
如:
<input name='test' type='checkbox'>
$('input:checkbox').attr('type'); 返回checkbox.
$('input:checkbox').attr('checked'); 返回undefined。
因为<input name='test' type='checkbox'>中没有checked关键字。
- prop是从属性对象中取值,属性对象中有多少属性,就能获取多少值,不需要在页面中显示定义。
比如$('input:checkbox').prop('checked'); 返回false。
这里就会遇到个问题:如果是自定义的属性,那么属性对象中是没有这个属性的。所以prop返回undefined。但是页面中可以检索到这个属性,所以attr是可以获取的。
其次
- attr获取的是初始化值,除非通过attr(‘name’,’value’)改变,否则值不变。prop属性值是动态的,比如checkbox,选中后,checked变为true,prop值也会发生改变。
总结
所以有个经验就是:
对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。快速,准确。
对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
js中prop和attr区别的更多相关文章
- jQuery中prop和attr区别
问题 今天给一个button加onclick事件,由于最后button根据需要转成字符串,因此不能使用jQurey.click(),只能给button添加onclick属性的方式. 于是,$butto ...
- jquery中prop和attr的区别
jquery中prop和attr的区别 prop: prop(name|properties|key,value|fn) **概述** 获取在匹配的元素集中的第一个元素的属性值. 随着一些内置属性的D ...
- js中const,var,let区别(转载)
js中const,var,let区别 来源:https://www.cnblogs.com/zzsdream/p/6372729.html 今天第一次遇到const定义的变量,查阅了相关资料整理了这篇 ...
- jquery中prop,attr,data的区别
这两天翻了jq的源码,今天看到了jq关于数据存储的几个方法,遂总结一下,和小伙伴没分享一下,哪里说的不对,还望批评指正~~~ 废话不多说,直接上代码: $(function(){ $('#div1') ...
- jQuery中的prop和attr区别
最近在做一个项目用jq时发现一个问题 在谷歌中可以正常出效果 但是在火狐中就是不行 就是这个prop和attr 之前用的是attr方法 但是在火狐中不出效果 于是特意看了两者的区别 主要 ...
- 【Jquery系列】prop和attr区别
问题描述 由于prop(property的缩写)和attr(attribute的缩写)翻译成汉语,均有“特性.属性”等意思的原因,导致大家容易混淆分不清,本篇文章将试图从英文含义,中文含义和Jquer ...
- js中const,var,let区别
今天第一次遇到const定义的变量,查阅了相关资料整理了这篇文章.主要内容是:js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始化. co ...
- JS中NULL和undifined区别及NULL的作用
1.博客地址:http://www.cnblogs.com/eastday/archive/2010/03/03/1677324.html 2.参考地址2:https://www.zhihu.com/ ...
- ES6 js中const,var,let区别 今天第一次遇到const定义的变量
今天第一次遇到const定义的变量,查阅了相关资料整理了这篇文章.主要内容是:js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始化. 1 ...
随机推荐
- fastjson 应用
fastjson优势就是解析快,用法和json-lib.jar差不多(如下图) 贴心的附上jar和反编译工具:https://pan.baidu.com/s/1iADAiFyoUZVBAFSPsIeY ...
- XML 对xml文件的crud的增加 create操作 增加元素 增加属性
把创建的节点挂到上一节点的最后 找到参考节点,使用insertBefore方法进行插入位置 xml添加属性使用setAttribute方法
- 模拟ie9的placeholder
ie9 的input框没有placeholder属性 啧啧啧~~~ 所以就用span标签来模拟一下 先判断浏览器类型 if(navigator.useAgent.indexOf("MSIE ...
- Spring Cloud 入门Eureka -Consumer服务消费(一)
这里介绍:LoadBalancerClient接口,它是一个负载均衡客户端的抽象定义,下面我们就看看如何使用Spring Cloud提供的负载均衡器客户端接口来实现服务的消费. 引用之前的文章中构建的 ...
- 【Effective C++ 读书笔记】条款04:确定对象使用前已先被初始化
永远在使用对象之前先将它初始化.对于无任何成员的内置类型,你必须手工完成此事. 至于内置类型以外的任何其他东西,初始化责任落在构造函数身上.规则很简单:确保每一个构造函数都将对象的每一个成员初始化. ...
- 使用PHP生成分享图片
小程序导航 wq.xmaht.top 假设代码中用到的资源文件夹在当前code_png目录下: /** * 分享图片生成 * @param $gData 商品数据,array * @param $co ...
- SSO 单点登录总结(PHP)
本篇文章根据个人理解的知识整理汇总,如有不足之处,请大家多多指正. 单点登录(SSO--Single Sign On)的应用是很普遍的,尤其在大型网站系统中,比如百度,登录百度账号和,再转到百度经验. ...
- TP3.2.3 页面跳转后 Cookie 失效 —— 参考解决方案
一.问题描述 接手一个项目,使用ThinkPhp3.2.3,在线上环境( Centos7.4 + Nginx1.14 + MySQL5.7 + PHP7.2.4 )运行没有问题, 在本地环境( php ...
- MySQL优化总结-查询总条数
1.COUNT(*)和COUNT(COL) COUNT(*)通常是对主键进行索引扫描,而COUNT(COL)就不一定了,另外前者是统计表中的所有符合的纪录总数,而后者是计算表中所有符合的COL的纪录数 ...
- shell+vim——05
ln --->link 链接, 链接有两种: 软连接 ln -s 源文件 目标文件 :相当于创建了一个快捷方式,源文件损坏后这个链接也就失效了 ln -s a.text a.text.s ...