zoukankan      html  css  js  c++  java
  • js获取元素样式包括非行内样式

    var obj=document.getElementById("id");

    由于js新版本的发放,越来越多的人喜欢用原生js而非jquery对dom元素进行操作,那么如果通过js获取dom元素的样式呢,很多人都知道用obj.style这种方式,但是,这种方式只能获取dom行内样式,一旦,我们定义class,然后再css文件里写时就会获取不到,下面我主要介绍获取行内样式和获取非行内样式两种获取方法。

    1,获取行内样式。

    <div style="200"  id="id">asd</div>

    直接运用obj.style."属性名",例如obj.style.width可以获得200;

    如果不知道属性名叫什么,可以打印dom对象console.dir(obj);在网页上你可以看到style里所有的属性,这些你都可以进行操作和读取

    2,获取非行内样式

    .test{

    height:200px;

    }

    <div style="200" class="test" id="id">asd</div>

    在这个例子如果我们用 obj.style.height获取的数值将会为空,

    a)在ie浏览器里,我们用到obj的currentStyle方法,来获取。 obj.currentStyle["height"]。

    b)在非ie浏览器里,我们需要用到window自带的方法,getComputedStyle(obj).height;

    这样我们就可以通过js获取元素属性了

      

  • 相关阅读:
    HashMap源码分析
    LinkedList源码分析
    ArrayList源码学习
    Java容器知识总结
    Collections 工具类和 Arrays 工具类常见方法
    Java基础知识
    MySQL高级之索引优化分析
    MySQL命令大全
    Java IO
    SpringCloud笔记
  • 原文地址:https://www.cnblogs.com/Ycc9/p/6726962.html
Copyright © 2011-2022 走看看