The difference between the prop () method and the Attr () method:
The specific usage of these two methods is not introduced here, you can refer to the prop () and attr () methods related manuals.
These two methods act as if they are exactly the same, in fact, most of the functions are the same, only in some special circumstances can be a few differences, the following examples are combined with an example of the difference between the two methods.
Let's look at a code example:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metaname= "Author"content= "http://www.softwhy.com/" /><title>The difference between the prop () function and the attr () function-Ant tribe</title><styletype= "Text/css">Li{List-style-type:None;font-size:12px;Color:Blue;width:300px;Height:20px;Line-height:20px;}a{width:200px;Height:20px;float: Left;}. CK{float: Left;width:26px; }. Time{Color:Red;width:60px;Height:20px;float: Right;}. do{font-size:12px;}</style><Scripttype= "Text/javascript"src= "Mytest/jquery/jquery-1.8.3.js"></Script><Scripttype= "Text/javascript">$ (document). Ready (function(){$("#myck"). Bind ("Click",function(){ $('Input[type=checkbox]'). Prop ('checked',$( This). Prop ('checked')); if($(". do"). Text ()=="Select All"){ $(". do"). Text ("Cancel"); } Else{ $(". do"). Text ("Select All"); }}) }) </Script> </Head><Body><Div><ul> <Li> <spanclass= "CK"><inputtype= "checkbox"/></span> <ahref="#">Ant Tribe welcomes You</a> <spanclass= "Time">12-13</span> </Li> <Li> <spanclass= "CK"><inputtype= "checkbox"/></span> <ahref="#">All right, long time no see.</a> <spanclass= "Time">12-13</span> </Li> <Li> <spanclass= "CK"><inputtype= "checkbox"/></span> <ahref="#">Ant Tribe</a> <spanclass= "Time">12-13</span> </Li> </ul><Div><inputtype= "checkbox"ID= "Myck"/><spanclass= "Do">Select All</span></Div></Div> </Body></HTML>
The above code is a very common check box for all and none of the functions, in the above code used prop () to get or set the Checked property value of the check box.
But if you put the following code:
$ (' input[type=checkbox] '). Prop (' Checked ', $ (this). Prop (' checked '))Modified to:
$ (' input[type=checkbox] '). Prop (' Checked ', $ (this). attr (' checked '))This will not enable the functionality we want. Here's a brief analysis of why:
When using the attr () method to get the value of the Checked property of the check box, if the check box is selected, then the property value obtained is checked, and if the obtained property value is undefined, it will not be possible to implement the function we want. The prop () method is a good way to compensate for the insufficiency of the attr () method, which returns TRUE or false uniformly.
Choice of two methods:
Some browsers just write disabled,checked can, and some to write disabled= "disabled", checked= "checked", such as with attr ("checked") The Checked property of the checkbox can be obtained when the value is selected, the value is "checked", but the get value is undefined.
The choice of the two methods is as follows:
1. Add property name This property will take effect should use Prop ();
2. There are true,false two attributes using prop ();
3. The other uses attr ();
In fact, it can not be hard to criticize, in order to avoid these problems directly only with prop () just fine.
The original address is: http://www.softwhy.com/forum.php?mod=viewthread&tid=5814
For more information, refer to: http://www.softwhy.com/jquery/
The difference between the prop () method and the attr () method
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
