{"name":"prop","type":"method","title":".prop()","deprecated":null,"removed":null,"desc":"Get the value of a property for the first element in the set of matched elements or set one or more properties for every matched element.","categories":["attributes","manipulation/general-attributes","version/1.6"],"entries":[{"return":[{"type":"String"},{"type":"Boolean"}],"signatures":{"added":"1.6","argument":{"desc":"The name of the property to get.","name":"propertyName","type":"String"}},"examples":{"desc":"Display the checked property and attribute of a checkbox as it changes.","code":"\n$( \"input\" ).change(function() {\n var $input = $( this );\n $( \"p\" ).html(\n \".attr( \\\"checked\\\" ): \" + $input.attr( \"checked\" ) + \"
\" +\n \".prop( \\\"checked\\\" ): \" + $input.prop( \"checked\" ) + \"
\" +\n \".is( \\\":checked\\\" ): \" + $input.is( \":checked\" ) ) + \"\";\n}).change();\n","css":"\n p {\n margin: 20px 0 0;\n }\n b {\n color: blue;\n }\n","html":"\n\n\n

\n"},"desc":"Get the value of a property for the first element in the set of matched elements.","longdesc":""},{"return":"jQuery","signatures":[{"added":"1.6","argument":[{"desc":"The name of the property to set.","name":"propertyName","type":"String"},{"type":[{"name":"String"},{"name":"Number"},{"name":"Boolean"}],"desc":"A value to set for the property.","name":"value"}]},{"added":"1.6","argument":{"desc":"An object of property-value pairs to set.","name":"properties","type":"PlainObject"}},{"added":"1.6","argument":[{"desc":"The name of the property to set.","name":"propertyName","type":"String"},{"desc":"A function returning the value to set. Receives the index position of the element in the set and the old property value as arguments. Within the function, the keyword this refers to the current element.","name":"function(index, oldPropertyValue)","type":"Function"}]}],"examples":{"desc":"Disable all checkboxes on the page.","code":"\n$( \"input[type='checkbox']\" ).prop({\n disabled: true\n});\n","css":"\n img {\n padding: 10px;\n }\n div {\n color: red;\n font-size: 24px;\n }\n","html":"\n \n \n \n \n"},"desc":"Set one or more properties for the set of matched elements.","longdesc":"\n

The .prop() method is a convenient way to set the value of properties—especially when setting multiple properties, using values returned by a function, or setting values on multiple elements at once. It should be used when setting selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, or defaultSelected. Since jQuery 1.6, these properties can no longer be set with the .attr() method. They do not have corresponding attributes and are only properties.

\n

Properties generally affect the dynamic state of a DOM element without changing the serialized HTML attribute. Examples include the value property of input elements, the disabled property of inputs and buttons, or the checked property of a checkbox. The .prop() method should be used to set disabled and checked instead of the .attr() method. The .val() method should be used for getting and setting value.

\n 
\n$( \"input\" ).prop( \"disabled\", false );\n$( \"input\" ).prop( \"checked\", true );\n$( \"input\" ).val( \"someValue\" );\n
\n

Important: the .removeProp() method should not be used to set these properties to false. Once a native property is removed, it cannot be added again. See .removeProp() for more information.

\n

Computed property values

\n

By using a function to set properties, you can compute the value based on other properties of the element. For example, to toggle all checkboxes based off their individual values:

\n 
\n$( \"input[type='checkbox']\" ).prop( \"checked\", function( i, val ) {\n  return !val;\n});\n
\n

Note: If nothing is returned in the setter function (ie. function( index, prop ){}), or if undefined is returned, the current value is not changed. This is useful for selectively setting values only when certain criteria are met.

\n "}]}