data-* 自定义数据属性 遇到的坑
除非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-* 自定义数据属性 遇到的坑的更多相关文章
- jquery 操作HTML data全局属性缓存的坑
data-* 全局属性 是一类被称为自定义数据属性的属性,它赋予我们在所有 HTML 元素上嵌入自定义数据属性的能力,并可以通过脚本(一般指JavaScript) 与 HTML 之间进行专有数据的交换 ...
- html5 自定义数据属性 ,也就是 data-* 自定义属性---笔记。
html5 自定义数据属性 ,也就是 data-* 自定义属性. 例如 <div data-last-value="43" data-hidden="true& ...
- 如何使用HTML5自定义数据属性
在本文中,我将向你介绍如何使用HTML5自定义数据属性.我还将向你介绍一些开发人员在工作中经常使用的优秀实例. 为什么需要自定义数据属性? 很多时候我们需要存储一些与不同DOM元素相关联的信息.这些信 ...
- spring data 自定义查询
spring data 自定义查询 https://www.cnblogs.com/airycode/p/6535635.html 在方法接口上面使用@Query
- 最近项目中使用Spring data jpa 踩过的坑
最近在做一个有关OA项目中使用spring data JPA 操作数据库,结果遇到了补个不可思议的麻烦.困惑了好久. 首先看一下问题吧,这就是当时测试“设置角色时,需要首先删除该用户已经拥有的角色时” ...
- spring data 自定义接口
1 spring data jpa 虽然说spring data 提供了很多DAO 接口,但是依然可能不能满足我们日常的使用,所以,有时我们需要自定义接口方法.自定义接口方法步骤如下: 1. 创建自 ...
- Andorid自定义attr的各种坑
本文来自网易云社区 作者:孙有军 在开发Andorid应用程序中,经常会自定义View来实现各种各样炫酷的效果,在实现这吊炸天效果的同时,我们往往会定义很多attr属性,这样就可以在XML中配置我们想 ...
- C++ sort使用自定义函数的一些坑
先看代码: 解释:使用自定义比较函数时,如果用了返回值恒为$true$或者恒为$false$的比较函数,就会这样子. 原因: https://stackoverflow.com/questions/4 ...
- django 自定义过滤器中的坑.
今天在创建自定义过滤器的时候,设置已正常.但是在运行后报: 'filter' is not a valid tag library: Template library filter not found ...
随机推荐
- UGUI Slider的onValueChanged事件
在本文,你将学到如何将UGUI Slider的onValueChanged事件进行统一管理. using System; using UnityEngine; using UnityEngine.UI ...
- docker安装mongo初体验
1.docker安装在此不做介绍,请自行百度:个人环境是在windows下运行cmd执行docker命令2.打算在docker下安装使用mongo,顺带熟悉docker,拉开篇章3.docker下安装 ...
- JS的正则表达式 - RegExp
RegExp 对象 RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具. 正则表达式的创建方式 1.文字格式,使用方法如下: /pattern/flags (即:/模式/标记) 2 ...
- ES6内容
iterator 遍历器iterator makeIterator是个遍历器,生成遍历器对象it var it = makeIterator(['a', 'b']); it.next() // { v ...
- npm update常用命令使用
一.更新 npm-check检查更新 npm install -g npm-check npm-check 2. npm-upgrade更新 npm install -g npm-upgrade np ...
- 删除trigger 禁用触发器 启用触发器 查看触发器
删除trigger drop trigger 触发器名 on 在那个表上 禁用触发器 Alter Table 表名 disable trigger 触发器名 启用触发器 Alter Table 表名 ...
- C#导入Excel|读取Excel方法
OleDbConnection读取 /// <summary> /// 返回Excel数据源 /// </summary> /// < ...
- 项目开发-->高级功能汇总
祭奠曾经逝去的青春…… 1.高级功能汇总-->Memcached之ASP.NET实现 2.高级功能汇总-->HubbleDotNet软件安装
- WebAPI搭建(二) 让WebAPI 返回JSON格式的数据
在RestFul风格盛行的年代,对接接口大多数人会选择使用JSON,XML和JSON的对比传送(http://blog.csdn.net/liaomin416100569/article/detail ...
- Node.js学习笔记(四) --- fs模块的使用
目录 . fs.stat 检测是文件还是目录 . fs.mkdir 创建目录 . fs.writeFile 创建写入文件 . fs.appendFile 追加文件 . fs.readFile 读取文件 ...