版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/cccmercy/article/details/81660440
结论
- 对于HTML元素本身就带有的
固有属性，处理时使用prop方法。 - 对于HTML元素
自定义属性，处理时使用attr方法。
固有属性指的是HTML标签原生支持的属性，如a标签原生支持的属性有：download、href、hreflang、media、rel、target、type，这些属性是W3C组织确定的，可通过W3School查询.
自定义属性指的是自己为HTML标签定义的属性，如：<a href="#" data-event="delete">删除</a>中的data-event即为自定义属性
使用场景
<body>
<form>
<input type="checkbox" name="hobby" value="movie" /> 电影
<input type="checkbox" name="hobby" value="music" checked="checked" /> 音乐
<select name="主食">
<option value="rice">米饭</option>
<option value="noodles" selected="selected">面条</option>
</select>
</form>
<button id="btn1">测试attr</button>
<button id="btn2">测试prop</button>
<script type="text/javascript" src="js/jquery.min.js" ></script>
// 上述js请改为你本地的
<script>
$('#btn1').click(function(){
console.log($('[value="movie"]').attr('checked')); // undefined
console.log($('[value="music"]').attr('checked')); // checked
console.log($('[value="rice"]').attr('selected')); // undefined
console.log($('[value="noodles"]').attr('selected')); // selected
});
$('#btn2').click(function(){
console.log($('[value="movie"]').prop('checked')); // false
console.log($('[value="music"]').prop('checked')); // true
console.log($('[value="rice"]').prop('selected')); // false
console.log($('[value="noodles"]').prop('selected')); // true
});
</script>
</body>对于checked或者selected属性，请使用prop方法，他返回的是选中状态：true或者false，使用attr方法，返回的是checked或者selected属性的属性值，如果没有添加该属性，返回undefined，如上面的例子。