zoukankan      html  css  js  c++  java
  • [javascript]javascript取得html元素,取得html样式,修改html样式

    一.取得html元素

    详情见:https://www.jb51.net/article/116460.htm

    1.通过ID获取(getElementById)

    document.getElementById('id')

    2.通过name属性(getElementsByName)

    document.getElementsByName('name')

    3.通过标签名(getElementsByTagName)

    document.getElementsByTagName('p')

    4.通过类名(getElementsByClassName)

    document.getElementsByClassName('class')

    5.获取html的方法(document.documentElement)

    document.documentElement是专门获取html这个标签的。

    document.documentElement

    浏览器控制台返回结果:

    6.获取body的方法(document.body)

    document.body是专门获取body这个标签的。

    document.body

    浏览器控制台返回结果:

    7.通过选择器获取一个元素(querySelector)

    document.querySelector('div .class')

    8.通过选择器获取一组元素(querySelectorAll)

    ocument.querySelectorAll('div .class')

    二.取得html样式

    取得元素的style即可:

    document.getElementById('id').style

    如:取得高度

    document.getElementById('id').style.height

    也可使用方法getBoundingClientRect(),取得更精确的信息:

    document.getElementById('id').getBoundingClientRect().width

    三.修改html样式

    修改元素的style即可:

    document.getElementById('id').style.height='10px'

     

  • 相关阅读:
    Ruby
    WebGL的第二个小程序
    wegGL的第一个小程序
    Node.js介绍
    接口隔离原则(Interface Sepreation Principle)
    参数
    字段/属性
    接口和抽象类
    javascript中的事件
    线性回归算法-4.多元线性回归算法
  • 原文地址:https://www.cnblogs.com/vickylinj/p/9814955.html
Copyright © 2011-2022 走看看