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中position()方法用法实例
Jan 16 Javascript
javascript中Array数组的迭代方法实例分析
Feb 04 Javascript
多个jQuery版本共存的处理方案
Mar 17 Javascript
iframe里使用JavaScript控制主页转向的方法
Apr 03 Javascript
最精简的JavaScript实现鼠标拖动效果的方法
May 11 Javascript
javascript html5 canvas实现可拖动省份的中国地图
Mar 11 Javascript
jQuery简单动画变换效果实例分析
Jul 04 Javascript
基于jQuery的ajax方法封装
Jul 14 Javascript
Vue.js弹出模态框组件开发的示例代码
Jul 26 Javascript
JavaScript实现邮箱后缀提示功能的示例代码
Dec 13 Javascript
node.js通过url读取文件
Oct 16 Javascript
小程序实现左滑删除的效果的实例代码
Oct 19 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
理解PHP5中static和const关键字的区别
2007/03/19 PHP
php 读取文件乱码问题
2010/02/20 PHP
php foreach 参数强制类型转换的问题
2010/12/10 PHP
PHP使用反射机制实现查找类和方法的所在位置
2016/04/22 PHP
laravel 实现用户登录注销并限制功能
2019/10/24 PHP
仅用[]()+!等符号就足以实现几乎任意Javascript代码
2010/03/01 Javascript
jquery validate.js表单验证的基本用法入门
2010/05/13 Javascript
js 数据类型转换总结笔记
2011/01/17 Javascript
DB.ASP 用Javascript写ASP很灵活很好用很easy
2011/07/31 Javascript
asp.net 30分钟掌握无刷新 Repeater
2011/09/16 Javascript
jquery对dom的操作常用方法整理
2013/06/25 Javascript
JS实现控制表格行内容垂直对齐的方法
2015/03/30 Javascript
js多功能分页组件layPage使用方法详解
2016/05/19 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
利用BootStrap的Carousel.js实现轮播图动画效果
2016/12/21 Javascript
利用JS实现文字的聚合动画效果
2017/01/22 Javascript
js实现打地鼠小游戏
2017/02/13 Javascript
微信小程序使用navigateTo数据传递的实例
2017/09/26 Javascript
vue插件开发之使用pdf.js实现手机端在线预览pdf文档的方法
2018/07/12 Javascript
详解vue-router数据加载与缓存使用总结
2018/10/29 Javascript
[01:14]英雄,所敬略同——2018完美盛典宣传视频4K
2018/12/05 DOTA
Python实现邮件的批量发送的示例代码
2018/01/23 Python
解决Python selenium get页面很慢时的问题
2019/01/30 Python
pip 安装库比较慢的解决方法(国内镜像)
2019/10/06 Python
使用python动态生成波形曲线的实现
2019/12/04 Python
Python基于smtplib协议实现发送邮件
2020/06/03 Python
python如何实现word批量转HTML
2020/09/30 Python
Johnston & Murphy官网: 约翰斯顿·墨菲牛津总统鞋
2018/01/09 全球购物
JAVA代码查错题
2014/10/10 面试题
趣味比赛活动方案
2014/02/15 职场文书
上课迟到检讨书
2014/02/19 职场文书
计划生育证明格式及范本
2014/10/09 职场文书
大学生心理健康活动总结
2015/05/08 职场文书
党员心得体会范文2016
2016/01/23 职场文书
vue实现同时设置多个倒计时
2021/05/20 Vue.js
MySQL 字符集 character
2022/05/04 MySQL