Usage of prop() and attr() in jQuery 1.9

Non-standard attributes can't be grabbed with .prop(), but attr() is deprecated - so what to do?

by John-Philip Johansson

HTML

<form>
  <input minlength="2" maxlength="5" custom1="123" />
</form>

<strong>Using $.fn.prop() - recommended</strong>
<ul id="prop"></ul>

<strong>Using $.fn.attr() - deprecated</strong>
<ul id="attr"></ul>

CSS

form {
    display: none;
}

JavaScript

var minlength, maxlength, custom;

// using $.fn.prop()

minlength = $('input').prop('minlength');
maxlength = $('input').prop('maxlength');
custom = $('input').prop('custom1');

$('#prop')
.append('<li>minlength: ' + minlength + '</li>')
.append('<li>maxlength: ' + maxlength + '</li>')
.append('<li>custom: ' + custom + '</li>');


// using $.fn.attr()

minlength = $('input').attr('minlength');
maxlength = $('input').attr('maxlength');
custom = $('input').attr('custom1');

$('#attr')
.append('<li>minlength: ' + minlength + '</li>')
.append('<li>maxlength: ' + maxlength + '</li>')
.append('<li>custom: ' + custom + '</li>');