jquery中data函數的用法示例

    jquery中data() 方法向被選元素附加數據，或者從被選元素獲取數據。這使咱們經過HTML自定義屬性，操做數據，顯得很是方便。一般咱們也會經過給html自定義屬性這樣的作法，來存儲和操做數據。在jquery中也給咱們

提供了data(name,value)這樣的方法，來很是方便的實現。有了data()這個方法，你就能夠很方便的在一個html標籤中添加data-*這樣的自定義屬性。接下來，就data()方法簡單的作下了解。

如下是摘自w3school中對data用法的說明：

data方法從元素中讀取數據的語法：

$(selector).data(name) name:可選。規定要取回的數據的名稱。
 若是沒有規定名稱，則該方法將以對象的形式從元素中返回全部存儲的數據。 

data方法從元素中存儲數據的語法：

$(selector).data(name,value)

 name:必需。規定要設置的數據的名稱。

 value:必需。規定要設置的數據的值。

  固然，咱們在這裏，也能夠把一個包含鍵/值對的對象，向被選元素添加數據。語法以下：

$(selector).data(object)

object:必需。規定包含名稱/值對的對象。

  Html代碼以下：

data方法之讀取數據:

<div id="divName" data-name="lichaoqiang">單個數據:data-name="lichaoqiang"</div>
    <div id="divJson" data-user='{"user_id":20141111,"user_name":"lichaoqiang"}'>存儲json數據:{"user_id":20141111,"user_name":"lichaoqiang"}</div>
    <script type="text/javascript">
        console.log($("#divName").data("name")); //經過name輸出單個數據
        console.log($("#divJson").data("user").user_name); //經過name輸出json數據
    </script> 

  注意：在元素data-*屬性中設置json數據時，須要注意單雙引號，不然可能出現undefined的,獲取不到數據。正確的作法是用雙引號。

data方法之存儲數據:

<div id="container">這是一個div標籤</div>

 <script type="text/javascript">
     $("#container").data("name", "lichaoqiang");//存儲數據
     console.log($("#container").data("name"));//經過name讀取數據
 </script>

  但願以上的介紹，可以幫助你們！