举个栗子:

 <div id="cost" data-drink="coffee"  data-food="sushi" data-meal="lunch">¥20.12</div>

现在我们想要获取这个div,那么:

 var cost = document.getElementById('cost');

接下来我们想要获取属性data-drink的值,我们通常会这样去做:

var typeOfDrink = cost.getAttribute("data-drink");

那么通过dataset,我们可以这样获取data-drink的值:

var typeOfDrink = cost.dataset.drink;

所以既然我们可以通过getAttribute获得属性,那么dataset存在的意义是什么呢?

假如我们想获取div所有的data属性,那么我们通过attribute方法需要通过循环遍历。

所有dataset的意义来了,它一句话就可以获取所有属性:

var expense = document.getElementById('cost').dataset;

每次你使用自定义data属性的时候,使用dataset去获取名-值对就是个不错的选择。

当然这个要考虑兼容性,具体问题具体分析,欢迎指正。

关于dataset的更多相关文章

  1. HTML5 数据集属性dataset

    有时候在HTML元素上绑定一些额外信息,特别是JS选取操作这些元素时特别有帮助.通常我们会使用getAttribute()和setAttribute()来读和写非标题属性的值.但为此付出的代价是文档将 ...

  2. C#读取Excel,或者多个excel表,返回dataset

    把excel 表作为一个数据源进行读取 /// <summary> /// 读取Excel单个Sheet /// </summary> /// <param name=& ...

  3. DataTable DataRow DataColumn DataSet

    1.DataTable 数据表(内存) 2.DataRow DataTable 的行 3.DataColumn DataTable 的列 4.DataSet 内存中的缓存

  4. C# DataSet装换为泛型集合

    1.DataSet装换为泛型集合(注意T实体的属性其字段类型与dataset字段类型一一对应) #region DataSet装换为泛型集合 /// <summary> /// 利用反射和 ...

  5. 读取Simulink中Dataset类型的数据

    http://files.cnblogs.com/files/pursuiting/%E5%80%92%E7%AB%8B%E6%91%86%E6%8E%A7%E5%88%B6%E7%B3%BB%E7% ...

  6. RDD/Dataset/DataFrame互转

    1.RDD -> Dataset val ds = rdd.toDS() 2.RDD -> DataFrame val df = spark.read.json(rdd) 3.Datase ...

  7. asp.net dataset 判断是否为空 ?

    1,if(ds == null) 这是判断内存中的数据集是否为空,说明DATASET为空,行和列都不存在!! 2,if(ds.Tables.Count == 0) 这应该是在内存中存在一个DATASE ...

  8. C#遍历DataSet中数据的几种方法总结

    //多表多行多列的情况foreach (DataTable dt in YourDataset.Tables) //遍历所有的datatable{foreach (DataRow dr in dt.R ...

  9. c#解析XML到DATASET及dataset转为xml文件函数

    //将xml对象内容字符串转换为DataSet         public static DataSet ConvertXMLToDataSet(string xmlData)         { ...

  10. C# DataSet

    一.基本概念 DataSet是ADO.NET的中心概念.可以把DataSet当成内存中的数据库,DataSet是不依赖于数据库的独立数据集合.所谓独立,就是说,即使断开数据链路,或者关闭数据库,Dat ...

随机推荐

  1. Swift 条件语句

    条件语句通过设定的一个或多个条件来执行程序,在条件为真时执行指定的语句,在条件为 false 时执行另外指定的语句. 可以通过下图来简单了解条件语句的执行过程: Swift 提供了以下几种类型的条件语 ...

  2. hibernate 第二次深入接触

    1.session 到底如何进行脏处理? 当一个Dept对象加入到session缓存时,Session会为Dept对象的值属性复制一份快照,当Session刷新缓存时,会进行脏处理. 2.OID 用来 ...

  3. 【ARM-Linux开发】"libxml/parser.h: 没有那个文件或目录"解决方案

    这是因为在ubuntu上没有安装libxml2-dev,这个包应该是开发用的,而已安装的libxml2应该只是像jre一样的部件. 解决方案:sudo apt-get install libxml2- ...

  4. elasticsearch数据库(ES)

    1. http://blog.csdn.net/cnweike/article/details/33736429 http://www.oschina.net/translate/elasticsea ...

  5. [CF261E]Maxim and Calculator_搜索_欧拉筛素数_动态规划

    Maxim and Calculator 题目链接:https://www.luogu.org/problem/CF261E 数据范围:略. 题解: 考试的时候只会暴力,学弟太强了$\%\%\% Or ...

  6. SQL SERVER 根据字段名称批量设置为主键

    --设置主键 --alter table 你的表名 add constraint pk_s primary key (id) SELECT 'alter table ' + TABLE_NAME + ...

  7. 自己动手写一个服务网关-java

    自己动手写一个服务网关 原文链接:https://www.cnblogs.com/bigben0123/p/9252444.html 引言 什么是网关?为什么需要使用网关? 如图所示,在不使用网关的情 ...

  8. IDEA配置之tomcat相关配置

    1. tomcat起服务时, 日志乱码 -server -XX:PermSize=512M -XX:MaxPermSize=1024m -Dfile.encoding=UTF-8 设置tomcat参数

  9. 【Funny Things】001——QQ循环发送消息

    借用Java的Robot类库中的键鼠模拟的方法,执行这个操作,首先切换到QQ界面,然后循环粘贴,回车发送消息. package newtest; import java.awt.*; import j ...

  10. split(".")不生效的问题

    前言:今天用String的split(".")函数分割字符串,结果总是一个空的String数组: 解决:输入的regex是一个正则表达式,很多在正则表达式里面有特殊意义的比如 &q ...