您现在的位置是:首页 > 随笔小记 > 大收获

jquery里prop和attr的区别

  • 大收获
  • 2018-11-08
  • 人已阅读
简介jquery里prop和attr的区别及使用方法。

在jquery里,我们要获取一个标签元素的属性,可以用attr或者prop,那么两者有什么区别呢?

其实很简单:

attr可以用来获取或生成“直接写在html标签里的属性”

prop可以用来获取元素的JS属性,如scrollHeight,offsetHeight等。
 

我们知道,scrollHeight是js里用来获取元素的完整高度,它是js的属性,并不是jquery属性,如果要在jquery里使用这个属性的话,需要把jquery对象转换成js对象,这样才能使用js的属性,而另一种方法就是用jquery里的prop函数,大家可以看下面站长以前写的一个关于滚动条的在线实例演示:

jquery操作滚动条的在线演示

在上面的实例里,我们要操作滚动条滚动到元素的底部时,就需要取得元素的scrollHiehgt属性的值,我们可以直接用"$(div).prop('scrollHeight')"来获取,但如果换成attr就获取不到了。

如果我们深入jquery的源码来研究,就能发现,jquery里的attr是基于setAttributegetAttribute来实现的,所以用attr是获取不到js对象的属性值的;

prop是通过对象实现的,如document.getElementById('div').name = 'one';

那么,在实际中,我们除了上面的情况外,我们什么时候用attr,什么时候用prop呢?

在我们要操作的是标签元素固有的一些属性时,推荐使用prop,固有属性指的是标签本身就有的一些属性,如a标签的href属性,img标签的src属性;

而在我们要操作的是自定义的一些属性时,推荐用attr;




著作权归作者所有。 
商业转载请联系作者获得授权,非商业转载请注明出处。
作者:付博瀚
来源:付博瀚个人博客
链接: https://www.fubohan.cn/

上一篇:HTML5 应用程序缓存

下一篇:返回列表

文章评论

Top