小编给大家分享一下jQuery中attr和prop方法有什么不同，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

相比 attr，prop 是 1.6.1 才新出来的，二者从中文意思理解，都是获得/设置属性的方法（attributes 和 properties）。只是，window 或 document 中使用 .attr() 方法在 jQuery1.6 之前不能正常运行，由于 window 和 document 中不能有 attributes。prop 应运而生了。

之前看网上对照二者的文章，更是列出一个表来辨别什么标签下使用 prop，什么标签下使用 attr，谅解我是怠惰的人，最惧怕要背的东西，所以只有自己想一想办法了。

既然我们想知道他们两的区分，最好就看看他们的源代码，不要被代码长度所吓到，我们只看关键的几句：

attr 方法代码（jQuery 版本 1.8.3）

attr:function(elem,name,value,pass){varret,hooks,notxml,nType=elem.nodeType;//don'tget/setattributesontext,commentandattributenodesif(!elem||nType===3||nType===8||nType===2){return;}if(pass&&jQuery.isFunction(jQuery.fn[name])){returnjQuery(elem)[name](value);}//Fallbacktopropwhenattributesarenotsupportedif(typeofelem.getAttribute==="undefined"){returnjQuery.prop(elem,name,value);}notxml=nType!==1||!jQuery.isXMLDoc(elem);//Allattributesarelowercase//Grabnecessaryhookifoneisdefinedif(notxml){name=name.toLowerCase();hooks=jQuery.attrHooks[name]||(rboolean.test(name)?boolHook:nodeHook);}if(value!==undefined){if(value===null){jQuery.removeAttr(elem,name);return;}elseif(hooks&&"set"inhooks&&notxml&&(ret=hooks.set(elem,value,name))!==undefined){returnret;}else{elem.setAttribute(name,value+"");returnvalue;}}elseif(hooks&&"get"inhooks&&notxml&&(ret=hooks.get(elem,name))!==null){returnret;}else{ret=elem.getAttribute(name);//Non-existentattributesreturnnull,wenormalizetoundefinedreturnret===null?undefined:ret;}}

prop 方法代码（jQuery 版本1.8.3）

prop:function(elem,name,value){varret,hooks,notxml,nType=elem.nodeType;//don'tget/setpropertiesontext,commentandattributenodesif(!elem||nType===3||nType===8||nType===2){return;}notxml=nType!==1||!jQuery.isXMLDoc(elem);if(notxml){//Fixnameandattachhooksname=jQuery.propFix[name]||name;hooks=jQuery.propHooks[name];}if(value!==undefined){if(hooks&&"set"inhooks&&(ret=hooks.set(elem,value,name))!==undefined){returnret;}else{return(elem[name]=value);}}else{if(hooks&&"get"inhooks&&(ret=hooks.get(elem,name))!==null){returnret;}else{returnelem[name];}}}

attr 方法里面，最关键的两行代码，elem.setAttribute(name,value+“”)和 ret=elem.getAttribute(name)，很明显的看出来，使用的 DOM 的 APIsetAttribute 和 getAttribute 方法操作的属性元素节点。

而 prop 方法里面，最关键的两行代码，return(elem[name]=value)和 returnelem[name]，你可以理解成这样document.getElementById(el)[name]=value，这是转化成 JS 对象的一个属性。

以上是“jQuery中attr和prop方法有什么不同”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！