Jquery 属性操作 ---prop，attr和data

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>


    </head>
    <body>
        <a href="http://www.baidu.cn" title="都好">都好</a>
        <input type="checkbox" name="" id="" checked>
        <div index="1" data-index="2">我升级后</div>
        <span data-index="123">123</span>
        <script type="text/javascript">
           $(function(){
               //1、 element.prop("属性名")获取元素固有的属性值
               console.log($("a").prop("href"));
               $("a").prop("title","我们都很好");
               $("input").change(function(){
                   console.log($(this).prop("checked"));
               });
               //console.log($("div").prop("index"));
               //2.元素的自定义属性,我们通过attr()
               console.log($("div").attr("index"));
               $("div").attr("index",4);
               console.log($("div").attr("data-index"));
               
               //3. 数据缓存data() 这个里面的数据是存放在元素里面
               $("span").data("uname","andy");
               //这个span在标签没有显示uname，但是是存在的
               console.log($("span").data("uname"));
               //这个方法获取data-index H5自定义的属性，第一个不用写data-
               console.log($("span").data("index"));
           })
        </script>
    </body>
</html>