Date: 2018jun8
Library: jQuery
Language: javaScript
Q. jQuery: when to use prop() vs attr()
A. In jQuery 1.6+
Use prop() for builtin properties, use attr for everything else.
For me prop('checked') and prop('disabled') are the most common builtin properties.
Examples:
$('#id').prop('checked', true);
$('#id').prop('disabled', true);
$('#id').prop('readonly', true);
const name = $('#id').prop('name'); // Use prop() for 'name'
const id = $('.myclass').attr('id); // Use attr() for 'id'
Here is the full list of builtin properties from
https://www.w3.org/TR/DOM-Level-2-HTML/html.html
interface HTMLInputElement : HTMLElement {
attribute DOMString defaultValue;
attribute boolean defaultChecked;
readonly attribute HTMLFormElement form;
attribute DOMString accept;
attribute DOMString accessKey;
attribute DOMString align;
attribute DOMString alt;
attribute boolean checked;
attribute boolean disabled;
attribute long maxLength;
attribute DOMString name;
attribute boolean readOnly;
// Modified in DOM Level 2:
attribute unsigned long size;
attribute DOMString src;
attribute long tabIndex;
// Modified in DOM Level 2:
attribute DOMString type;
attribute DOMString useMap;
attribute DOMString value;
void blur();
void focus();
void select();
void click();
};