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


Posted in Javascript onJuly 29, 2019

跨浏览器方法

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.浏览器默认设置的

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

Javascript 相关文章推荐
Jquery知识点三 jquery表单对象操作
Jan 17 Javascript
javascript中window.event事件用法详解
Dec 11 Javascript
JS中getYear()和getFullYear()区别分析
Jul 04 Javascript
js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)
Nov 09 Javascript
JQueryEasyUI之DataGrid数据显示
Nov 23 Javascript
使用JavaScript为一张图片设置备选路径的方法
Jan 04 Javascript
浅谈js中function的参数默认值
Feb 20 Javascript
利用node.js写一个爬取知乎妹纸图的小爬虫
May 03 Javascript
JS中跳出循环的示例代码
Sep 14 Javascript
vue调试工具vue-devtools安装及使用方法
Nov 07 Javascript
微信小程序实现联动选择器
Feb 15 Javascript
微信小程序关键字变色实现代码实例
Dec 13 Javascript
教你搭建按需加载的Vue组件库(小结)
Jul 29 #Javascript
JavaScript 继承 封装 多态实现及原理详解
Jul 29 #Javascript
Vue2.0实现简单分页及跳转效果
Jul 29 #Javascript
JavaScript面向对象程序设计中对象的定义和继承详解
Jul 29 #Javascript
js实现多张图片每隔一秒切换一张图片
Jul 29 #Javascript
javascript面向对象程序设计实践常用知识点总结
Jul 29 #Javascript
javascript中this的用法实践分析
Jul 29 #Javascript
You might like
推荐几部必看的DC动画电影
2020/03/03 欧美动漫
PHP 面向对象实现代码
2009/11/11 PHP
php地址引用(php地址引用的效率问题)
2012/03/23 PHP
php导入导出excel实例
2013/10/25 PHP
WordPress中制作导航菜单的PHP核心方法讲解
2015/12/11 PHP
自己整理的一个javascript日期处理函数
2010/10/16 Javascript
jQuery 开发者应该注意的9个错误
2012/05/03 Javascript
浅析JavaScript原型继承的陷阱
2013/12/03 Javascript
一个通过script自定义属性传递配置参数的方法
2014/09/15 Javascript
jQuery实现平滑滚动到指定锚点的方法
2015/03/20 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
分享JavaScript与Java中MD5使用两个例子
2015/12/23 Javascript
基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载)
2016/02/22 Javascript
jquery实现ajax加载超时提示的方法
2016/07/23 Javascript
AngularJs  unit-testing(单元测试)详解
2016/09/02 Javascript
angular 用拦截器统一处理http请求和响应的方法
2017/06/08 Javascript
jQuery代码优化方法总结
2018/01/29 jQuery
vue实现自定义多选与单选的答题功能
2018/07/05 Javascript
node crawler如何添加promise支持
2020/02/01 Javascript
python中关于for循环的碎碎念
2017/06/30 Python
vscode 配置 python3开发环境的方法
2019/09/19 Python
django admin 根据choice字段选择的不同来显示不同的页面方式
2020/05/13 Python
pandas创建DataFrame的7种方法小结
2020/06/14 Python
基于PyTorch的permute和reshape/view的区别介绍
2020/06/18 Python
Python识别验证码的实现示例
2020/09/30 Python
美国蔬菜和植物种子公司:Burpee
2017/02/01 全球购物
浅谈react路由传参的几种方式
2021/03/23 Javascript
医药工作岗位求职信分享
2013/12/31 职场文书
一月红领巾广播稿
2014/02/11 职场文书
关于读书的演讲稿800字
2014/08/27 职场文书
创先争优活动个人总结
2015/03/04 职场文书
社区扶贫帮困工作总结
2015/05/20 职场文书
初中班主任教育随笔
2015/08/15 职场文书
高中班主任工作总结(范文)
2019/08/20 职场文书
nginx location优先级的深入讲解
2021/03/31 Servers
Nginx已编译的nginx-添加新模块
2021/04/01 Servers