原生js利用data选择元素
//js
var a = document.querySelector('[data-word=a]')
console.log(a)
html
<dl class="find-car-content">
<dt data-word=a>a</dt>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dt data-word=b>b</dt>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dd>奥迪</dd>
<dl>
原生js利用data选择元素的更多相关文章
- 原生JS与JQ获取元素的区别
刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...
- 原生JS获取HTML DOM元素的8种方法
JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...
- 原生js来写获取元素距离顶部距离,以及滚动条滚动指定距离和时间控制
这是我在写vue项目里封装的一个公共js类 里面还有一些其他的方法,一并拿过来了 class Public { isDesktop(){ //判断是否为pc端 return (window.scree ...
- 原生JS和jQuery创建元素的方法
jQ创建元素的方法 1.原生代码 .creatElement('tr')` .innerHTML = '<h1>加油</h1>' document.write('<h1& ...
- 原生js获取 一个dom元素距离页面可视区域的位置值 -- getBoundingClientRect
getBoundingClientRect() 这个方法返回一个矩形对象,包含四个属性:left.top.right和bottom.分别表示元素各边与页面上边和左边的距离. var box=docum ...
- 原生js实现清除子元素节点
var table = document.body.querySelector('.mui-table-view'); while(table.hasChildNodes()) //当table下还存 ...
- D3.js的v5版本入门教程(第三章)—— 选择元素和绑定数据
D3.js的v5版本入门教程(第三章) 在D3.js中,选择元素和绑定元素是最基本的内容,也是很重要的内容,等你看完整个教程后你会发现,这些D3.js教程都是在选择元素和绑定元素的基础上展开后续工作的 ...
- 原生js获取元素样式
摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...
- 原生js与jquery加载页面元素比较
原生js:将获取元素的语句写到页面头部,会因为元素还没有加载而出错,js提供了window.onload 这个方法事先加载元素 <script type="text/javascrip ...
随机推荐
- Bootstrap 时间日历插件bootstrap-datetimepicker配置与应用小结
Bootstrap时间日历插件bootstrap-datetimepicker配置与应用小结 by:授客 QQ:1033553122 1. 测试环境 win7 JQuery-3.2.1.min ...
- 简单学习HTML
最近突然就对静态页面很有兴趣,主要是看到几个比较酷炫的页面效果,也想自己做一下,但是我的前端页面就是菜鸡,还停留在html+css+jquery的简单使用上,而且还忘记得差不多了! 而且我感觉前端比后 ...
- 利用Azure虚拟机安装Dynamics 365 Customer Engagement之八:安装报表扩展及最新更新
我是微软Dynamics 365 & Power Platform方面的工程师罗勇,也是2015年7月到2018年6月连续三年Dynamics CRM/Business Solutions方面 ...
- 为什么AlertDialog要使用Builder来构建呢
为什么 AlertDialog 使用Builder 模式呢? 首先说句废话,因为 AlertDialog 太过复杂,内部参数太多,然后不使用构建者模式那么 AlertDialog 的构造方法就可能是: ...
- 剑指offer 28:字符串的排列
题目描述 输入一个字符串,按字典序打印出该字符串中字符的所有排列.例如输入字符串abc,则打印出由字符a,b,c所能排列出来的所有字符串abc,acb,bac,bca,cab和cba. 输入描述 输入 ...
- Nginx web基础入门
目录 Nginx web基础入门 如何升级nginx或者添加功能 使用systemd管理nginx nginx相关配置文件 nginx的配置文件详解 日志格式 game日志记录实战 日志切割 手写虚拟 ...
- linux shell脚本相关知识
最近的项目中,有一个编写linux shell脚本的任务.由于之前不是很熟悉,在这个过程中遇到了很多困难,查找了很多资料,也收获了很多.下面是linux shell脚本中常用的知识总结. 1基础语法 ...
- JVM-5-GC(Garbage Collection) 垃圾回收机制
GC(Garbage Collection) 垃圾回收机制 什么是垃圾回收机制 垃圾回收是一种动态存储管理技术,它自动地释放不再被程序引用的对象,按照特定的垃圾收集算法来实现资源自动回收的功能. ...
- Gson的序列化和反序列化-待更新
反序列化为List List<Person> persons =gson.fromJson(json, new TypeToken<List<Person>>() ...
- 【Excel】删除重复值