15621857753

JS学习教程之DOM获取和操作元素的方法

来源:齐鲁建站 栏目:开发教程 阅读: 日期:2023-07-27

JS学习教程之DOM获取和操作元素的方法,分别为 根据 id 名称获取 ;根据元素 类名 获取 ;根据元素 标签名 获取 ;根据 选择器 获取一个 ;根据 选择器 获取一组

一、获取元素的五种方法

根据 id 名称获取

document.getElementById('id名称')

根据元素 类名 获取

document.getElementsByClassName('元素类名')

根据元素 标签名 获取

document.getElementsByTagName('元素类名')

根据 选择器 获取一个

document.querySelector('选择器')

根据 选择器 获取一组

document.querySelectorAll('选择器')

二、 操作元素内容

文本内容

元素.innerText

超文本内容

元素.innerHTML

三、 操作元素原生属性

获取: 元素.属性名

设置: 元素.属性名 = '属性值'

四、操作元素自定义属性

获取: 元素.getAttribute()

设置: 元素.setAttribute()

删除: 元素.removeAttribute()

五、操作元素类名

获取: 元素.className

设置: 元素.className='新类名'

六、操作元素行内样式

获取: 元素.style.样式名

设置: 元素.style.样式名 = '样式值'

七、获取元素非行内样式

window.getComputedStyle(元素).样式名

展开