DOM-选择器
2021/6/28 23:24:01
本文主要是介绍DOM-选择器,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
DOM选择器
document.getElementById('id名称')
document.getElementsByClassName('类名')
document.getElementsByTagName('标签名')
document.getElementsByName('name 属性')
document.querySelector('选择器')
document.querySelectorAll('选择器')
---------------------------------------------------------------------------------------------
操作原生属性
+ 读:
=> 元素.属性名
=> 得到的就是元素身上该属性的值
+ 写:
=> 元素.属性名 = 属性值
=> 设置和修改元素身上的该属性
操作自定义属性
2-1. 设置
=> 语法: 元素.setAttribute('属性名', '属性值')
=> 作用: 给元素设置或者修改一个自定义属性
2-2. 获取
=> 语法: 元素.getAttribute('属性名')
=> 返回值: 元素该属性的值
=> 注意: 不管你设置的时候, 是什么数据类型, 拿到的都是字符串类型
2-3. 删除
=> 语法: 元素.removeAttribute('属性名')
=> 作用: 删除元素身上该自定义属性
操作 H5 自定义属性
+ 元素身上带有一个属性叫做 dataset, 是一个类似对象的数据结构
+ dataset 内记录的都是元素身上 data- 开头的属性
+ 对于一个元素身上自定义属性的操作, 就是对这个 dataset 的操作
+ 增加: 元素.dataset.属性名 = 属性值
+ 修改: 元素.dataset.属性名 = 属性值
=> 原先有该属性名就是修改, 原先没有就是增加
+ 删除: delete 元素.dataset.属性名
+ 查询: 元素.dataset.属性名
+ 注意: 以上属性名是不包含 data- 的部分
这篇关于DOM-选择器的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-14后台交互资料入门指南
- 2024-11-14如何轻松创建项目环境:新手入门教程
- 2024-11-14如何抽离公共代码:初级开发者指南
- 2024-11-14Python编程入门指南
- 2024-11-14Python编程入门:如何获取参数
- 2024-11-14JWT 用户校验:简单教程与实践
- 2024-11-14Pre-commit 自动化测试入门指南
- 2024-11-14Python编程基础
- 2024-11-14Server Action入门教程:轻松掌握服务器操作
- 2024-11-14Server Component入门教程:轻松搭建服务器组件