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. jedis处理redis cluster集群的密码问题

    环境介绍:jedis:2.8.0 redis版本:3.2 首先说一下redis集群的方式,一种是cluster的 一种是sentinel的,cluster的是redis 3.0之后出来新的集群方式 本 ...

  2. Bootstrap 字形图标(Glyphicons)

    http://w3c.3306.biz/bootstrap/eg/bootstrap--glyphicons-list.html

  3. 【2】最简单的Laravel5.1程序分析

    1.上图!说一下laravel的基本MVC(模型-控制器-视图)原理 2.具体分析 用户输入网址localhost:8888之后,首先请求发送到服务器的laravel应用的public目录下index ...

  4. 使用POI插件,提取导出excel的工具类

    在网站的不同的模块都需要使用到导入导出excel的功能,我们就需要写一个通用的工具类ExcelUtil. 我的思路:首先,导入和导出的Excel的文件格式固定:主标题,二级标题,数据行(姑且就这么叫) ...

  5. iOS学习之自定义视图时,在屏幕发生旋转时触发重新布局方法

    如果要对自定义的视图在屏幕旋转时重新布局,则在自定义视图中定义以下触发方法: -(void)layoutSubviews { [super layoutSubviews]; //1.获取到屏幕旋转的方 ...

  6. c#获取特性DescriptionAttribute的值

    int detailId = Convert.ToInt32(id); BillLoanApplyDetail model = _billLoadApplyDetail.GetBillLoanAppl ...

  7. AFNetworking 使用方法(2.0)

    AFNetworking 使用方法(2.0) 分类: IOS2014-11-12 09:17 2018人阅读 评论(0) 收藏 举报   目录(?)[+]   本文介绍的是AFNetworking-2 ...

  8. angular中设置$http的post请求的数据传递格式

    ArgularJS的$http方法支持全局设置: $http.defaults.headers.post["Content-Type"] = "application/x ...

  9. 可以让javascript加快的脚本(收藏了)

    <?php        ob_start('ob_gzhandler');        header("Cache-Control: public");        h ...

  10. eclipse安装github插件egit

    http://jingyan.baidu.com/article/4853e1e529483c1909f726c3.html help->InstallNew Software,这是安装插件推荐 ...