jQuery中prop和attr的区别

149 阅读1分钟
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>

<body>
<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F201403%2F29%2F20140329145413_hw4HA.thumb.1000_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1639962681&t=866b8a257506e211619b799cd9b0bcaa"
alt="图片加载中" data-name="zhangsan">

<!-- <input type="checkbox" name="" id="" checked> -->
<input type="checkbox" name="" id="">
<script src="./jquery-1.12.4.js"></script>
<script>
    /* alt是本身就有的属性 所有两者都能使用 */
    // alert( $('img').attr('alt') );
    // alert( $('img').prop('alt') );

    // alert( $('img').prop('data-title') );
    // $('img').prop('data-title','我爱南京');
    /* attr 和 prop的区别 */
    /* 获取和设置自定义属性的时候 使用attr 不能使用prop */
    /* 获取自身属性的时候使用prop */
    console.log( $('input[type=checkbox]').attr('checked') ) //选中的时候 checked 未选中是undefined
    console.log( $('input[type=checkbox]').prop('checked') ) //选中的时候 true 未选中是false
</script>
</body >

</html>