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. (转).net控件dropdownlist动态绑定数据

    DropDownList控件的使用(数据绑定)(.net学习笔记二)(2006-10-12 07:28:49) 转载   分类:.net学习笔记 一.在页面初始化时候将集合绑定到DropDownLis ...

  2. Linux命令:TOP

    top命令 是Linux下常用的性能 分析工具 ,能够实时显示系统 中各个进程的资源占用状况,类似于Windows的任务管理 器.下面详细介绍它的使用方法. top - 02:53:32 up 16 ...

  3. Oracle复杂查询

    1:列出所有员工的姓名,部门名称,和工资 select a1.ename,a1.sal,a2.dname from emp a1,dept a2 where a1.deptno = a2.deptno ...

  4. hdu 2199

    Problem Description Now,given the equation 8*x^4 + 7*x^3 + 2*x^2 + 3*x + 6 == Y,can you find its sol ...

  5. table不能遗露了tbody

    1.假如创建一个空表 ,然后去设置它的innerHTML,并获取表单的高度:在ie10及其他的浏览器中,会像预期一样正常被解析出来: <!DOCTYPE html> <html> ...

  6. 用phpMyAdmin修改mysql数据库密码

    1初始数据库密码为空. 2第一步,点击phpMyAdmin里的用户选项. 3选择root localhost用户名,点击编辑权限. 4此时会出来修改权限的页面,里面可以设置的选项还是比较多的,暂时不管 ...

  7. ognl.NoSuchPropertyException(没有对应属性异常)

    ognl.NoSuchPropertyException: com.xie.struts2.tags.modal.Student.sName(没有对应属性异常) at ognl.ObjectPrope ...

  8. Hibernate整合Struts2时报错

    今天在整合Hibernate和Struts2的时候遇到一个问题 总是出现各种异常,经过仔细检查,代码本身并没有问题, ----------------------------------------- ...

  9. POJ 2986 A Triangle and a Circle

    题意:给定一个三角形,以及一个圆的圆心坐标和半径,求圆和三角形的相交面积. 思路: 用三角剖分,三角形上每个线段都变成这个线段与圆心的三角形,然后算出每个三角形与圆的相交面积,然后根据有向面积的正负累 ...

  10. .net 中的DllImport

    只有做成COM的C++ dll才能直接引用.没有做成COM的就只能用P/Invoke(DllImport)或者C++/CLI那种.不过P/Invoke容易类型对不上,所以要是函数多,最好用C++/CL ...