


The difference between attr() and prop() in jQuery when modifying the checked attribute_jquery
May 16, 2016 pm 04:41 PMWhen making the check box select button, a problem occurred. Use the statement $.attr('checked',true) to change the attribute of the check box to checked. It is the first in the chrome browser. It won't work after the first click is valid. IE8 has no problem.
Baidu took a long time to find out that the reason is that the attributes of HTML are divided into attributes and properties. Let’s call the latter properties for now.
The checked attribute is divided into attribute->checked, and property->true, false.
For a checkbox, if checked="checked" is not defined, the result of alert($.attr("checked")) is undefined. If defined, the result is checked. The attribute does not change as the status of the checkbox changes.
If prop($.attr("checked")) is used, the output will be false and true respectively. The property changes as it changes.
So prop() should be used when modifying the checked attribute. prop() was added after jQuery 1.6.
Charts about other similar properties on the Internet:
In addition, in versions before IE9, if the property is not deleted before the DOM element is removed, using the .prop() method to set the value of the DOM element property (except simple types: number, string, boolean) will cause a memory leak. . In order to safely set the value of the DOM object and avoid memory leaks, you can use the .data() method. I haven't encountered it yet, so I'll write it down here.

Hot Article

Hot tools Tags

Hot Article

Hot Article Tags

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics
![How to solve '[Vue warn]: Missing required prop' error](https://img.php.cn/upload/article/000/887/227/169304743965914.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to solve '[Vue warn]: Missing required prop' error
![How to solve the '[Vue warn]: Invalid prop: invalid value' error](https://img.php.cn/upload/article/000/465/014/169294628931912.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to solve the '[Vue warn]: Invalid prop: invalid value' error
![How to solve the '[Vue warn]: Invalid prop: custom validator' error](https://img.php.cn/upload/article/000/000/164/169254319231018.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to solve the '[Vue warn]: Invalid prop: custom validator' error
![How to solve '[Vue warn]: Invalid prop: type check' error](https://img.php.cn/upload/article/000/887/227/169306085649427.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to solve '[Vue warn]: Invalid prop: type check' error
![How to deal with '[Vue warn]: Avoid mutating a prop directly' error](https://img.php.cn/upload/article/000/465/014/169224194948720.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to deal with '[Vue warn]: Avoid mutating a prop directly' error

Comparison of multi-level delivery schemes in Vue component communication
![How to solve the '[Vue warn]: Avoid mutating a prop directly' error](https://img.php.cn/upload/article/000/465/014/169226406590115.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to solve the '[Vue warn]: Avoid mutating a prop directly' error
![How to solve the '[Vue warn]: Invalid prop: update value' error](https://img.php.cn/upload/article/000/465/014/169305238381644.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
How to solve the '[Vue warn]: Invalid prop: update value' error
