JavaScript如何获取一个元素的样式信息

 更新时间:2019年07月29日 10:29:56   作者:城里的乡下人  
这篇文章主要介绍了JavaScript如何获取一个元素的样式信息,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

跨浏览器方法

function getStyle(elem, cssprop, cssprop2){
 if(elem.currentStyle){
  return elem.currentStyle[cssprop]
  }else if(document.defaultView && document.defaultView.getComputedStyle){
  return document.defaultView.getComputedStyle(elem, "").getPropertyValue(cssprop2)
 }else{
  return null
 }
}
<style> 
 #elem{font-size:23px;} 
</style> 
<input id ="elem" style="font-size:18px;"/> 
<script>
elem.style.fontSize = '12px'; 
console.log(getStyle(elem, "fontSize", "font-size")) 
// 输出12px 
</script>

getStyle取值的优先级是:

1.动态设置的

2.内联设置的

3.样式表设置的

4.浏览器默认设置的

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • js canvas实现随机粒子特效

    js canvas实现随机粒子特效

    这篇文章主要为大家详细介绍了js canvas随机粒子特效,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-04-04
  • JavaScript中获取鼠标位置相关属性总结

    JavaScript中获取鼠标位置相关属性总结

    这篇文章主要介绍了JavaScript中获取鼠标位置相关属性总结,本文重点在搞清楚这些属性的区别,需要的朋友可以参考下
    2014-10-10
  • javascript写的一个模拟阅读小说的程序

    javascript写的一个模拟阅读小说的程序

    这篇文章主要介绍了用javascript写了一个模拟阅读小说的程序,需要的朋友可以参考下
    2014-04-04
  • js中??是什么意思(示例场景)

    js中??是什么意思(示例场景)

    ?? 是一个非常有用的运算符,特别适合在需要区分 null/undefined 和其他假值的场景中使用,它可以帮助你更精确地处理默认值逻辑,本文给大家介绍js中??是什么意思,感兴趣的朋友一起看看吧
    2025-04-04
  • 利用JavaScript实现栈的数据结构示例代码

    利用JavaScript实现栈的数据结构示例代码

    栈(stack)又名堆栈,它是一种运算受限的线性表,下面这篇文章主要给大家介绍了关于利用JavaScript实现栈的数据结构的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-08-08
  • Javascript 浮点运算精度问题分析与解决

    Javascript 浮点运算精度问题分析与解决

    浮点数的精度问题不是JavaScript特有的,因为有些小数以二进制表示位数是无穷的
    2014-03-03
  • JavaScript前端静态资源预加载实现示例

    JavaScript前端静态资源预加载实现示例

    这篇文章主要为大家介绍了JavaScript前端静态资源预加载实现示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-11-11
  • JS关于刷新页面的相关总结

    JS关于刷新页面的相关总结

    在本篇内容中我们给大家整理了关于JS刷新页面的所有相关知识点以及整理了相关的技术文章,大家可以收藏本页面继续深入学习。
    2018-05-05
  • 利用Javascript获取选择文本所在的句子详解

    利用Javascript获取选择文本所在的句子详解

    这篇文章主要给大家爱介绍了关于利用Javascript获取选择文本所在的句子的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起看看吧。
    2017-12-12
  • javascript中几个容易混淆的概念总结

    javascript中几个容易混淆的概念总结

    这篇文章主要介绍了javascript中几个容易混淆的概念总结,都是平时经常遇到的问题,这里推荐给大家,有需要的小伙伴参考下吧。
    2015-04-04

最新评论