Discussion on the issues of .attr() and .prop() in jQuery_jquery

By the way, I wrote a few lines of code and it can run normally on IE8, but not on Chrome and FF. My friend said this is RP, which is depressing!

In fact, the functional requirements are as follows, two radios: male and female, and one button: reset. The startup page selects male by default. After the user selects female and clicks the reset button, it needs to be restored to the default state.

Copy code The code is as follows:

male
female
Reset

My js code is like this:

Copy code The code is as follows:

$("#reSet").click(function() {
　$("input[name='sex']:first").attr("checked",true);
});

The result is what I mentioned at the beginning. I asked several people but couldn’t explain it clearly. Later I checked the API and found out that the .prop() method was added in the jQuery1.6 version. , seems to be no different from .attr(), both can be used to get and set attribute values. Later, I learned that the .prop() method is suitable for Boolean value attributes. The official explanation is that selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, and defaultSelected properties require the .prop() method. In addition, there are many people on the Internet who say "add the attribute name and the attribute will take effect. You should use .prop()". I have not verified other attributes, but the "checked" attribute does take effect when added. Therefore, the two red points should be the difference between .attr() and .prop().

So, change the code in the click event method above to the following.

Copy code The code is as follows:

$("input[name='sex']: first").prop("checked",true);