DOM查找与操作(document)_js

来源:
网络
收录时间:
2021-03-04 13:20:05
社会 阅读 197951

摘要:DOM就是document操作,就是找到对应需要操作的html标签。lastElementChild 最后一个子标签。nextElementSibling 下一个兄弟标签。tag.innerHtml 操作内部所有内容。tag.value 操作标签的value值。tag.className="" 直接对整体进行操作。tag.classList 对class的列表操作。tag.style.fontSize=‘16px‘ 直接对style属性操作

一、DOM操作

DOM就是document操作,就是找到对应需要操作的html标签

二、查找获取标签

1、直接查找

document.getElementById  根据标签id属性查找

document.getElementsByName  根据标签的name属性进行查找

document.getElementsByClassName 根据class属性进行查找

document.getElementsByTagName  根据标签名进行查找

2、间接查找

parentElement  父节点标签

chlidren:所有子标签

firstElementChild 第一个字标签

lastElementChild  最后一个子标签

nextElementSibling  下一个兄弟标签

previousElementSibling  上一个兄弟标签

 

 

三、操作标签

1、文本操作

tag.innerText   操作文本内容

tag.innerHtml  操作内部所有内容

tag.value  操作标签的value值

2、样式操作

tag.className="" 直接对整体进行操作

tag.classList  对class的列表操作

  tag.classList.add(‘样式名‘)  添加样式

  tag.classList.remove(‘样式名‘)  删除样式

3、style操作

tag.style.fontSize=‘16px‘  直接对style属性操作

4、属性操作

tag.setAttribute(‘属性名‘,‘属性值‘)  添加属性

tag.getAttribute(‘属性名‘)  获取属性

tag.removeAttribute(‘属性名‘)  删除属性

tag.attributes 获取所有属性

 

DOM查找与操作(document)_js

原文地址:https://www.cnblogs.com/chenxiaozan/p/12683438.html

查看全文
返回顶部