5月21星期一DOM
2018-05-21 本文已影响0人
梁萌0328
1.DOM:文档对象模型,操作页面中的元素,增删改查
(1)查:
1,通过元素间关系:
父子关系:
//查找某个元素的父元素:parentElement
//查找某个元素的子元素:返回一个动态集合(数组)
children
//查找第一个子元素 获取中间的元素加下标
firstElementChild
//查找最后一个子元素
lastElementChild
兄弟关系
//前一个兄弟元素
previousElementSibling
//下一个兄弟元素
nextElementSibling
2,通过HTTML查找
1) ID 只能找到一个,找不到返回null
var ele=document.getElementById('id名');
2) class 特点:可以找到多个,返回一个动态集合; 没有找到返回一个空集合; 多个class名设置样式需要遍历
var ele=document.getElementsByClassName('class名');
3) 标签: var ele=document.getElementsByTagName('标签名');
可以找到多个,返回一个动态集合
找不到返回空集合 设置样式需要遍历
4)name属性 只适用于表单元素
var ele=document.getElementsByName('name名');
返回一个动态集合,设置样式需要遍历
3.通过选择器查找
var ele=document.querySelector('选择器');
特点:只能找一个
设置样式不需要遍历
var ele=document.querySelectorAll('选择器');
能找到多个 返回一个动态集合 设置样式需要遍历