欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

使用jQuery獲取data-的自定義屬性

 更新時間:2015年11月10日 11:50:51   投稿:hebedich  
本文給大家分享的是使用jQuery制作的組件,實現(xiàn)獲取data-自定義屬性,并附上使用方法,非常的實用,有需要的小伙伴可以參考下

廢話少說,先上代碼

jQuery.fn.dataset = function(attr, val) {
    // 獲取數(shù)據(jù)集
    if (arguments.length == 0) {
      var dataset = {};
      jQuery(this).eq(0).each(function() {
        var attrs = this.attributes;
        for (var i = 0, l = attrs.length; i < l; i++) {
          var attr = attrs[i];
          if (/^data-/i.test(attr.name)) {
            dataset[decode(encode(attr.name.substring(5)))] = autobox(attr.value);
            if (decode(encode(attr.name.substring(5))) == "path") {
              dataset[decode(encode(attr.name.substring(5)))] = attr.value != null ? String(attr.value) : null;
            }
            if (decode(encode(attr.name.substring(5))) == "name") {
              dataset[decode(encode(attr.name.substring(5)))] = attr.value != null ? String(attr.value) : null;
            }
          }
        }
      });
      return dataset;
    }

    // 返回指定數(shù)據(jù)
    if (arguments.length == 1 && typeof attr != 'object') {
      if(encode(attr) == "data-path"){
        return this.attr(encode(attr));
      }
      return autobox(this.attr(encode(attr)));
    }

    // 設(shè)置數(shù)據(jù)集
    var dataset = attr;
    if (typeof attr != 'object') {
      dataset = {};
      dataset[attr] = String(val);
    }
    var tmp = {};
    jQuery.each(dataset, function(k, v) {
      tmp[encode(k)] = autobox(v);
    });
    return this.attr(tmp);
  };

通過jQuery制作組件,可以輕松獲取到我們data-的自定義屬性,也可以給data-屬性來賦值。

獲取:

$("div").dataset("name") //獲取data-name的值

賦值:

$("div").dataset("name","Tezml") //給data-name這個屬性賦值為Tezml

相關(guān)文章

  • jQuery插件FusionCharts繪制的3D環(huán)餅圖效果示例【附demo源碼】

    jQuery插件FusionCharts繪制的3D環(huán)餅圖效果示例【附demo源碼】

    這篇文章主要介紹了jQuery插件FusionCharts繪制的3D環(huán)餅圖效果,結(jié)合完整實例形式分析了jQuery使用FusionCharts載入xml格式數(shù)據(jù)繪制圖形的操作步驟與相關(guān)實現(xiàn)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
    2017-04-04
  • jQuery學習筆記之jQuery的事件

    jQuery學習筆記之jQuery的事件

    事件總是由內(nèi)層開始執(zhí)行,一直到最外層,不單擊了那個對象,所有包含了此對象的對象所綁定的事件都將執(zhí)行一次,這是我們不愿意看到的,jQuery給我們定義了一些阻止事件執(zhí)行的方法。
    2010-12-12
  • 詳解jquery事件delegate()的使用方法

    詳解jquery事件delegate()的使用方法

    這篇文章主要詳解了jquery事件delegate()的使用方法,delegate() 方法為指定的元素(屬于被選元素的子元素)添加一個或多個事件處理程序,并規(guī)定當這些事件發(fā)生時運行的函數(shù),感興趣的小伙伴們可以參考一下
    2016-01-01
  • jquery事件重復綁定的快速解決方法

    jquery事件重復綁定的快速解決方法

    本篇文章主要是對jquery事件重復綁定的快速解決方法進行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助
    2014-01-01
  • jquery zTree異步加載、模糊搜索簡單實例分享

    jquery zTree異步加載、模糊搜索簡單實例分享

    這篇文章主要為大家詳細介紹了jquery zTree異步加載、模糊搜索簡單實例,感興趣的小伙伴們可以參考一下
    2016-03-03
  • JQuery中基礎(chǔ)過濾選擇器用法實例分析

    JQuery中基礎(chǔ)過濾選擇器用法實例分析

    這篇文章主要介紹了JQuery中基礎(chǔ)過濾選擇器用法,涉及jQuery屬性選擇及樣式操作的相關(guān)技巧,需要的朋友可以參考下
    2015-05-05
  • jQuery實現(xiàn)獲取當前鼠標位置并輸出功能示例

    jQuery實現(xiàn)獲取當前鼠標位置并輸出功能示例

    這篇文章主要介紹了jQuery實現(xiàn)獲取當前鼠標位置并輸出功能,涉及jQuery事件響應及頁面元素屬性動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下
    2019-01-01
  • JQuery實現(xiàn)表格數(shù)據(jù)行上移與下移

    JQuery實現(xiàn)表格數(shù)據(jù)行上移與下移

    這篇文章主要為大家詳細介紹了JQuery實現(xiàn)表格數(shù)據(jù)行上移與下移,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-02-02
  • jQuery版Tab標簽切換

    jQuery版Tab標簽切換

    網(wǎng)上常見的應用,用jQuery實現(xiàn)起來比較簡單,只有幾行代碼。
    2011-03-03
  • jQuery前端開發(fā)35個小技巧

    jQuery前端開發(fā)35個小技巧

    這篇文章主要介紹了jQuery前端開發(fā)35個小技巧的相關(guān)資料,非常實用,需要的朋友可以參考下
    2016-05-05

最新評論