十四、给span添加自定义属性

<span id='sid' ></span>
<span id='sid2' data-cate="444"></span>
<button id="js">JSClick</button>
<button id="jq">JQClick</button>
<script src="js/jquery-3.1.1.min.js"></script>
<script>
    var spanObj = document.getElementById("sid");
    spanObj.setAttribute("data-cate", 'lowRate');    // js设置属性，相对于jq
    $("#js").click(function () {
        alert(spanObj.dataset.cate);       // js获取属性，相对于jq
    })

    $("#jq").click(function () {
        $("#sid2").attr('data-cate','555');     // jq设置属性
        alert($("#sid2").data('cate'));          // jq获取属性
        alert($("#sid2").attr('data-cate'));      // jq获取属性
    })

</script>

来源：https://www.cnblogs.com/cllgeek/articles/5859908.html