美文网首页
Dom中的查

Dom中的查

作者: 常婧帅 | 来源:发表于2018-06-04 21:06 被阅读0次

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('选择器');

能找到多个 返回一个动态集合 设置样式需要遍历

相关文章

  • Dom中的查

    Dom中的查### 1.通过元素间的关系#### 1)父子关系 parentElement 查找一个元素的父元素...

  • Dom中的查

    1.DOM:文档对象模型,操作页面中的元素,增删改查 (1)查: 1,通过元素间关系: 父子关系: //查...

  • 5月21星期一DOM

    1.DOM:文档对象模型,操作页面中的元素,增删改查 (1)查: 1,通过元素间关系: 父子关系: //查...

  • DOM 的一些增删改查

    以下是JS中DOM节点中增删改查的基本API: 查 增 删 改 学习参考:原生JS中CSS相关API合集

  • JavaScript⑩DOM

    1.DOM:文档对象模型,操作页面中的元素,增删改查 (1)查: 1,通过元素间关系: 父子关系: //查找...

  • JavaScript 九、DOM

    1.DOM:文档对象模型,操作页面中的元素,增删改查 (1)查: 1,通过元素间关系: 父子关系: //查找...

  • DOM

    1.DOM:文档对象模型,操作页面中的元素,增删改查 (1)查: 1,通过元素间关系: 父子关系: //查找...

  • 5月21日 文档对象模型DOM

    1.DOM:文档对象模型,操作页面中的元素,增删改查 (1)查找: 1,通过元素间关系: 父子关系: //查...

  • DOM

    DOM:文档对象 操作页面中的元素 可以增删改查 查: 1. 通过元素间的关系 父子关系: 查找某个父元...

  • DOM

    DOM:文档对象 操作页面中的元素 可以增删改查 查: 1. 通过元素间的关系 父子关系: 查找某个父元...

网友评论

      本文标题:Dom中的查

      本文链接:https://www.haomeiwen.com/subject/rdfusftx.html