用法一：获取属性

获取某属性

$(selector).prop(attribute)

例子

获取图片 src 属性值

$("#imgId").attr("src");

获取标签没显示定义的属性

如果当前元素 没有设定某属性，浏览器会默认给这个元素加上 默认值，如下面代码，图片有默认的 width 和 height，使用 .prop() 可以获取到，使用 .attr() 获取不到：

<button id="btn">attr获取属性</button>
<button id="btn2">prop获取属性</button>
<br>
<img id="pic" src="img/5.jpg" >

<script src="js/jquery-1.11.0.js"></script>
<script>
    $(function(){
        $("#btn").click(function(){
            var width = $("#pic").attr("width")
            console.log("width：",width)
        })
        $("#btn2").click(function(){
            var width = $("#pic").prop("width")
            console.log("width：",width)
        })
    })
</script>

注意：不能获取自定义属性

标签中的自定义属性，是无法获取到的，返回的是 undefined

html：

<div id="info" data-id="1" data-name="李雷"></div>
<button id="btn">获取自定义属性</button>

JavaScript：

<script src="js/jquery-1.11.0.js"></script>
<script>
    $(function(){
        $("#btn").click(function(){
            var id = $("#info").prop("data-id")
            var name = $("#info").prop("data-name")
            console.log("id：",id)
            console.log("name：",name)
        })
    })
</script>

用法二：设置属性

设置某属性

$(selector).prop(attribute,value)

例子

设置图片 src 属性值

$("#imgId").attr("src",path);

设置自定义属性（不推荐）

.prop() 方法设置 自定义属性，在浏览器元素中看不到，但可以获取到

可以使用 .attr() 方法、.data() 方法

html：

<div id="info"></div>
<button id="btn">获取属性</button>
<button id="btn2">设置属性</button>

js：

<script>
    $(function(){
        $("#btn").click(function(){
            var id = $("#info").prop("data-id")
            var name = $("#info").prop("data-name")
            console.log("id：",id)
            console.log("name：",name)
        })
        $("#btn2").click(function(){
            var id = $("#info").prop("data-id",'20')
            var name = $("#info").prop("data-name",'韩梅梅')
        })
    })
</script>

测试1：

点击 设置属性 按钮，浏览器如下图，看不到自定义属性：

测试2：

点击 获取属性 按钮，显示如下：

id： 20
name： 韩梅梅

参考：
https://www.runoob.com/jquery/html-attr.html

原文出处：/show_1IX5mxdkNgaB.html