jQuery.fn.dataset = function(attr, val) {
// 获取数据集
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;
} // 返回指定数据
if (arguments.length == 1 && typeof attr != 'object') {
if(encode(attr) == "data-path"){
return this.attr(encode(attr));
}
return autobox(this.attr(encode(attr)));
} // 设置数据集
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

自制获取data-自定义属性的更多相关文章

  1. Vue执行方法,方法获取data值,设置data值,方法传值

    方法写在methods中 v-on:click="run()" @click="run()" 方法获取data中的数据通过this.数据获取 方法设置data中 ...

  2. html5中event获取data和class

    获取data和class var tare=$(e.relatedTarget).data("id");var tar=event.target;console.log(tare) ...

  3. data自定义属性获取方法和设置

    <!--原生获取方法--> <div data-id="id=1"></div> <script> //js原生获取方法 var i ...

  4. 如何获取input自定义属性

    javascript方法: <input type="checkbox"  name="sdf"  data="这是自定义属性" /& ...

  5. vue父子组件之间互相获取data值&调用方法(非props)

    vue 子组件调用父组件方法&数据 vue有$parent这么一个属性,在子组件中就能拿到父组件的数据 this.$parent.xxx 就能调用父组件的方法 this.$parent.xxx ...

  6. jquery获取data-xxx自定义属性的值遇到的问题

    直接用jquery的 data("name") 获取 data-name的值有问题,获取的只是最初的值,即使后边改变也不会变,所以还是要用attr("data-name& ...

  7. 【vue】——vue.js 获取当前 自定义属性值

    假设有一个标签h5, 我们给它添加了一个自定义属性值,(item.id是从动态添加的) 点击h5 标签,如何才能获取当前对应的自定义属性值呢? 想当然的我最开始这样写: <h5 class=&q ...

  8. Vue 在beaforeCreate时获取data中的数据

    众所周知,vue在beforecreate时期是获取不到data中的 数据的 但是通过一些方法可以实现在beforecreate时获取到data中的数据 暂时想到两种放发可以实现,vue在before ...

  9. Vue beaforeCreate时获取data中的数据

    异步获取即:通过    $this.$nextTick或者settimeout,这连dom都可以拿出来 beforeCreate() { this.$nextTick(function() { con ...

随机推荐

  1. 工程与科学数值方法的Matlab实现

    %stats.m function [mean,stdev]=stats(x) n=length(x);mean=sum(x)/n;stdev=sqrt(sum((x-mean).^2/(n-1))) ...

  2. 服务器安装VMware ESXI5.5

    一.VMware ESXI5.5 vSphere5.5 VIMSetup下载http://blog.sina.com.cn/s/blog_61c07ac50101gy64.html(1)VMware安 ...

  3. 外观模式-facade实现interface的方式(简单工厂+facade组合使用)

    Façade 外观模式 1.Façade实现为interface的具体过程 在Façade.java 接口 工厂 将构造方法私有  static 方法产生一个工厂 此时 客户端不知道 Façade的存 ...

  4. C#属性和readonly类型

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  5. QWidget使用qss样式的background-image属性

    最近在学习Qt使用QSS样式美化窗口部件的内容.发现在对QWidget应用background-image改变窗口背景图片时,QWidget的窗口背景并未生效.工程建立如下:    1.新建 Qt A ...

  6. uva 10061 How many zero's and how many digits ?

    How many zeros and how many digits? Input: standard input Output: standard output Given a decimal in ...

  7. jquery mobile转场时加载js失效

    jquery mobile拦截了所有的http请求,并使用ajax请求取代传统的http.请求发出后,框架会将请求的内容插入到页面中data- role="page"的部分,取代原 ...

  8. 每次从vss获取文件都是只读

    在 Visual Studio 2008 中,使用 VSS 作为源码管理器,把文件签入后,文件会自动变为只读状态.在公司习惯是在某个开发人员的机器上获取最新的代码后编译,编译完之后服务器上再从 VSS ...

  9. Nutshell.ThreadWorkerPool .Net线程池设计

    功能描述: 支持创建多个线程池,并统一管理 支持不同线程池的容量控制,以及最少活动线程的设置 支持不同线程池中活动线程的闲时设置,即线程空闲时间到期后即自动被回收 结构设计: ThreadWorker ...

  10. 配色问题lingo实现

    大家好,我是小鸭酱,博客地址为:http://www.cnblogs.com/xiaoyajiang !调配颜色 要依次调配红.兰.白.黑.黄五种颜色 红  兰  白  黑  黄 红  0  6  1 ...