首页 > Web开发 > 详细

DOM查找与操作(document)_js

时间:2020-04-12 09:36:21      阅读:42      评论:0      收藏:0      [点我收藏+]

一、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

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!