jquery之data()方法

data有什么作用？
　　在我们平时js编码过程中，我们经常会向DOM元素中添加各种自定义属性，这样有一个弊端。
　　1 假设我们在DOM元素中添加了一个属性，这个属性指向了某个js对象。 dom1.ele = jsObj
　　2 当这个js对象发挥完作用后，我们已经用不到他了。这时候按理说应该把这个js变量清空，释放内存。大家都知道，如果一个js对象不存在任何外在引用的话，解释器会自动将其在内存中删除，这也是javascript相对于c++等手动管理内存的程序的优点。
　　3 但是这时候问题来了，因为DOM元素引用了这个js对象，尽管这个js对象已经没有存在的意义了，但是解释器是不会把他删除的。如果想要把其删除，我们可能需要将DOM元素的这个属性设置为null。
　　4 我们编写了这么多的代码，哪里能把 每个js对象是不是被DOM元素引用了都记住啊？
　　5 而且，假如DOM元素与js对象之间相互循环引用，根本就无法删除！ 这就是内存泄漏
　　6 所以，为了避免这种情况的发生，我们要尽量避免 引用数据(这里的引用数据可以说是javascript对象) 直接依附在DOM对象上。
　　7 data就是用来搞定以上问题的方法。（以上为转载）
data()方法，用于存储/获取临时数据。也是一种缓存机制。
获取储存在id为box1上面的临时数据

<div id="box1">
    </div>
    <script src="js/jquery-1.11.3.js"></script>
    <script>
      $(function () {
          $("#box1").data({
            name: "王五",
            age: "29",
          });
          console.log($('#box1').data('name'));
          console.log($('#box1').data('age'));
        });
    </script>

结果：

获取已经在标签上的data值

<div id="box1" data-name="张三" data-age="24">
    </div>
    <script src="js/jquery-1.11.3.js"></script>
    <script>
          console.log($('#box1').data('name'));
          console.log($('#box1').data('age'));
    </script>

用data方法对临时数据进行操作

<div id="box1">
      <p data-name="张三" data-age="24" data-profession="前端开发工程师">
        张三
      </p>
      <p data-name="李四" data-age="24" data-profession="UI设计师">李四</p>
    </div>
    <button type="button" id="btn1">获取datad的name值</button>
    <button type="button" id="btn2">修改data</button>
    <script src="js/jquery-1.11.3.js"></script>
    <script>
      $(function () {
        $("#btn1").click(function () {
          alert($("#box1 p").data("name")); //获取匹配的元素集合中的第一个元素的data的值。
        });
        $("#btn2").click(function () {
          $("#box1 p:eq(0)").data({
            name: "王五",
            age: "29",
            profession: ".Net开发工程师",
          });
        });
      });
    </script>

单击获取的效果：

修改之后在获取的效果：

data方法在ajas出来之后基本就很少有人去使用了，毕竟jquery相对来说是一门比较老牌的第三方了。