zoukankan      html  css  js  c++  java
  • JS基础(DOM查询)

    获取元素节点
    通过document对象调用
    1.getElementById()
    -通过id属性获取一个元素节点对象
    2.getElementsBy TagName()
    -通过标签名获取一组元素节点对象
    3.getElementsByName()
    -通过name属性获取一组元素节点对象

    获取元素节点的子节点
    通过具体的元素节点调用
    1.getElementsByTagName()
    -方法,返回当前节点的指定标签名后代节点
    2.childNodes
    -属性,表示当前节点的所有子节点
    childNodes属性会获取包括文本节点在内的所有节点
    根据DOM规定,标签间空白也会当成文本节点

    注意:在IE8及以下的浏览器中,不会将空白文本当成子节点,
    所以该属性在IE8中会返回4个子元素而其他浏览器是9个

    children属性可以获取当前元素的所有子元素

    3.firstChild
    -属性,表示当前节点的第一个子节点
    根据DOM规定,标签间空白也会当成文本节点
    firstElementChild获取当前元素的第一个子元素
    firstElementChild不支持IE8及以下的浏览器,如果需要兼容他们尽量不要使用

    4.lastChild
    -属性,表示当前节点的最后一个子节点
    根据DOM规定,标签间空白也会当成文本节点
    lastElementChild获取当前元素的最后一个子元素
    lastElementChild不支持IE8及以下的浏览器,如果需要兼容他们尽量不要使用


    获取父节点和兄弟节点
    通过具体的节点调用
    1.parentNode
    -属性,表示当前节点的父节点
    2.previousSibling(也可能获取到空白的文本)
    -属性,表示当前节点的前一个兄弟节点
    3.nextSibling(也可能获取到空白的文本)
    -属性,表示当前节点的后一个兄弟节点

    previousElementSibling获取前一个兄弟元素,IE8及以下不支持

    innerText
    -该属性可以获取到元素内部的文本内容
    -它和innerHTML类似,不同的是它会自动将html标签去除

    文本框的value属性值,就是文本框中填写的内容

    在document中有一个属性body,它保存的是body的引用

    document.documentElement保存的是html根标签

    document.all代表页面中所有的元素

    根据元素的class属性值查询一组元素节点对象
    getElementsByClassName()可以根据class属性值获取一组元素节点对象,
    但是该方法不支持IE8及以下的浏览器

    document.querySelector()
    -需要一个选择器的字符串作为参数,可以根据一个CSS选择器来查询一个元素节点对象
    -虽然IE8中没有getElementsByClassName()但是可以使用querySelector()代替
    -使用该方法总会返回唯一的一个元素,如果满足条件的元素有多个,那么它只会返回第一个

    document.querySelectorAll()
    -该方法和querySelector()用法类似,不同的是它会将符合条件的元素封装到一个数组中返回
    -即使符合条件的元素只有一个,它也会返回数组

     

  • 相关阅读:
    内存碎片
    《大规模分布式存储系统》笔记——单机存储系统、分布式系统
    数据库的范式
    一把剪刀看懂git reset 和它的三个参数
    如何判断一个链表是否有环?以及对一些文章的错误的看法
    自由树的计数 Labeled unrooted tree counting
    C语言里的指针探析——type *name[] 在函数参数里面,是一个二维指针
    CSAPP(深入理解计算机系统)读后感
    VIM一些常用命令,方法,配置
    Latex 常用知识点存档
  • 原文地址:https://www.cnblogs.com/MDZZZ/p/12497386.html
Copyright © 2011-2022 走看看