除非data-*自定义数据属性的值是固定不变的,否则最好不要把data-*作为查询条件。

例子:

<div data-index="0">hello</div>

var div= document.querySelector("div[data-index=\"0\"]");

console.log(div);//正常

div.dataset.index=1;//更新属性值

var newDiv= document.querySelector("div[data-index=\"1\"]");//使用更新后的属性值来查询元素

console.log(newDiv);//查询不正常,找不到data-index为1的元素,因为自定义数据的值被修改后不会同步到页面标签属性中,此时data-index属性值仍是0,更新的不过是dataset中的值

data-* 自定义数据属性 遇到的坑的更多相关文章

  1. jquery 操作HTML data全局属性缓存的坑

    data-* 全局属性 是一类被称为自定义数据属性的属性,它赋予我们在所有 HTML 元素上嵌入自定义数据属性的能力,并可以通过脚本(一般指JavaScript) 与 HTML 之间进行专有数据的交换 ...

  2. html5 自定义数据属性 ,也就是 data-* 自定义属性---笔记。

    html5  自定义数据属性 ,也就是 data-* 自定义属性.  例如 <div data-last-value="43" data-hidden="true& ...

  3. 如何使用HTML5自定义数据属性

    在本文中,我将向你介绍如何使用HTML5自定义数据属性.我还将向你介绍一些开发人员在工作中经常使用的优秀实例. 为什么需要自定义数据属性? 很多时候我们需要存储一些与不同DOM元素相关联的信息.这些信 ...

  4. spring data 自定义查询

    spring data 自定义查询 https://www.cnblogs.com/airycode/p/6535635.html 在方法接口上面使用@Query

  5. 最近项目中使用Spring data jpa 踩过的坑

    最近在做一个有关OA项目中使用spring data JPA 操作数据库,结果遇到了补个不可思议的麻烦.困惑了好久. 首先看一下问题吧,这就是当时测试“设置角色时,需要首先删除该用户已经拥有的角色时” ...

  6. spring data 自定义接口

    1 spring data jpa 虽然说spring data 提供了很多DAO 接口,但是依然可能不能满足我们日常的使用,所以,有时我们需要自定义接口方法.自定义接口方法步骤如下: 1.  创建自 ...

  7. Andorid自定义attr的各种坑

    本文来自网易云社区 作者:孙有军 在开发Andorid应用程序中,经常会自定义View来实现各种各样炫酷的效果,在实现这吊炸天效果的同时,我们往往会定义很多attr属性,这样就可以在XML中配置我们想 ...

  8. C++ sort使用自定义函数的一些坑

    先看代码: 解释:使用自定义比较函数时,如果用了返回值恒为$true$或者恒为$false$的比较函数,就会这样子. 原因: https://stackoverflow.com/questions/4 ...

  9. django 自定义过滤器中的坑.

    今天在创建自定义过滤器的时候,设置已正常.但是在运行后报: 'filter' is not a valid tag library: Template library filter not found ...

随机推荐

  1. python yield、yield from与协程

    从生成器到协程 协程是指一个过程,这个过程与调用方协作,产出由调用方提供的值.生成器的调用方可以使用 .send(...)方法发送数据,发送的数据会成为yield表达式的值.因此,生成器可以作为协程使 ...

  2. url传递参数带 + ,解决办法

    修改客户端,将客户端带“+”的参数中的“+”全部替换为‍“%2B”,这样参数传到服务器端时就能得到“+”了.

  3. 手机端页面调试工具-vconsole使用

    用的是VUE-CLI3第一步.安装vconsole npm install vconsole 第二步.创建js文件并写入内容 import Vconsole from 'vconsole' let v ...

  4. ActivityManagerService数据结构Activity栈管理(二)

    ActivityManagerService要管理四大组件,那四大组件就必须在AMS中有存在的形式,这里先从AMS 如何管理Activity 谈起: Activity在AMS 中存在的形式为Activ ...

  5. webstorm 上传代码到gitlab

    1. 2. 3.push 4.填写上传url

  6. golang mcall

    // func mcall(fn func(*g)) // Switch to m->g0's stack, call fn(g). // Fn must never return. It sh ...

  7. cloudera-scm-server启动时出现Caused by: javax.persistence.PersistenceException: org.hibernate.exception.GenericJDBCException: Could not open connection问题解决方法(图文详解)

    问题现象 查看 [root@cmbigdata1 cloudera-scm-server]# pwd /var/log/cloudera-scm-server [root@cmbigdata1 clo ...

  8. 更新jdk后 Light Table无法找到新版本jdk的bin目录

    原来是lein构建工具中保存了原来jdk版本记录,就是这个profiles文件 原来jdk1.7.0_17 我现在改成如下图jdk1.7.0_40 问题解决

  9. xamarin for android webservice

    首先新建一个空网站,添加一个webservice服务.然后在UserWebService.cs类里编写对外服务的方法 [WebMethod] public string IsCorret(string ...

  10. JavaScript数组forEach循环

    JavaScript数组forEach循环 今天写JavaScript代码把forEach循环数组忘记写法了,在此记录一下以防止未来忘记. let a = [1, 2, 3]; a.forEach(f ...