自制获取data-自定义属性
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-自定义属性的更多相关文章
- Vue执行方法,方法获取data值,设置data值,方法传值
方法写在methods中 v-on:click="run()" @click="run()" 方法获取data中的数据通过this.数据获取 方法设置data中 ...
- html5中event获取data和class
获取data和class var tare=$(e.relatedTarget).data("id");var tar=event.target;console.log(tare) ...
- data自定义属性获取方法和设置
<!--原生获取方法--> <div data-id="id=1"></div> <script> //js原生获取方法 var i ...
- 如何获取input自定义属性
javascript方法: <input type="checkbox" name="sdf" data="这是自定义属性" /& ...
- vue父子组件之间互相获取data值&调用方法(非props)
vue 子组件调用父组件方法&数据 vue有$parent这么一个属性,在子组件中就能拿到父组件的数据 this.$parent.xxx 就能调用父组件的方法 this.$parent.xxx ...
- jquery获取data-xxx自定义属性的值遇到的问题
直接用jquery的 data("name") 获取 data-name的值有问题,获取的只是最初的值,即使后边改变也不会变,所以还是要用attr("data-name& ...
- 【vue】——vue.js 获取当前 自定义属性值
假设有一个标签h5, 我们给它添加了一个自定义属性值,(item.id是从动态添加的) 点击h5 标签,如何才能获取当前对应的自定义属性值呢? 想当然的我最开始这样写: <h5 class=&q ...
- Vue 在beaforeCreate时获取data中的数据
众所周知,vue在beforecreate时期是获取不到data中的 数据的 但是通过一些方法可以实现在beforecreate时获取到data中的数据 暂时想到两种放发可以实现,vue在before ...
- Vue beaforeCreate时获取data中的数据
异步获取即:通过 $this.$nextTick或者settimeout,这连dom都可以拿出来 beforeCreate() { this.$nextTick(function() { con ...
随机推荐
- OD调试9—实例:深入分析代码完成软件破解
OD调试9—实例:深入分析代码完成软件破解 爆破,是最初级的解决方案,不到万不得已,我们不直接修改JNZ通关.因为这样子的话,我们就享受不到破解.逆向的真正乐趣了. 了解程序背后按照剧情发展经常会出 ...
- js中的因数分解
方法一: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8& ...
- FFT与多项式、生成函数题目泛做
题目1 COGS 很强的乘法问题 高精度乘法用FFT加速 #include <cstdlib> #include <iostream> #include <algorit ...
- Qt添加窗口背景图片、Label图片显示、、Label文字显示
一.添加窗口背景图片 重写MainWindow绘制事件 void MainWindow::paintEvent(QPaintEvent *event) { QPainter painter(this) ...
- Linux下运行C++程序出现"段错误(核心已转储)"的原因
今天写程序出现了“段错误(核心已转储)"的问题,查了一下资料,加上自己的实践,总结了以下几个方面的原因. 1.内存访问出错 这类问题的典型代表就是数组越界. 2.非法内存访问 出现这类问题 ...
- 慕课linux学习笔记(七)常用命令(4)
帮助命令 Man命令 Man的级别 命令帮助 可被内核调用的函数帮助 函数和函数库帮助 特殊文件帮助 /dev 配置文件帮助 游戏的帮助 其他杂项的帮助 管理员可用命令帮助 内核相关文件的帮助 -f ...
- DOM 节点属性
DOM 节点属性 在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeT ...
- 滑雪(POJ 1088 记忆化搜索)
滑雪 Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 88094 Accepted: 33034 Description ...
- 【好程序员笔记分享】——Cocoapods集成
-iOS培训,iOS学习-------型技术博客.期待与您交流!------------ Xcode集成POD教程 准备工作: 首先我们要在我们的电脑中安装POD,进入命令行,输入如下指令 sudo ...
- 灯塔(LightHouse)
Description As shown in the following figure, If another lighthouse is in gray area, they can beacon ...