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 名称冲突的解决方法
Apr 08 Javascript
node.js入门教程迷你书、node.js入门web应用开发完全示例
Apr 06 Javascript
node.js中的socket.io的广播消息
Dec 15 Javascript
浅谈JavaScript正则表达式分组匹配
Apr 10 Javascript
JavaScript实现简单的tab选项卡切换
Jan 05 Javascript
浅谈AngularJS中ng-class的使用方法
Nov 11 Javascript
Vue生命周期示例详解
Apr 12 Javascript
利用ES6的Promise.all实现至少请求多长时间的实例
Aug 28 Javascript
js实现类似iphone的网页滑屏解锁功能示例【附源码下载】
Jun 10 Javascript
CKeditor4 字体颜色功能配置方法教程
Jun 26 Javascript
JS为什么说async/await是generator的语法糖详解
Jul 11 Javascript
Vue使用预渲染代替SSR的方法
Jul 02 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
PHP函数preg_match_all正则表达式的基本使用详细解析
2013/08/31 PHP
php使用pclzip类实现文件压缩的方法(附pclzip类下载地址)
2016/04/30 PHP
浅谈PHP实现大流量下抢购方案
2017/12/15 PHP
js 加载时自动调整图片大小
2008/05/28 Javascript
js单独获取一个checkbox看其是否被选中
2014/09/22 Javascript
JS获取及设置TextArea或input文本框选择文本位置的方法
2015/03/24 Javascript
js检测用户输入密码强度
2015/10/22 Javascript
jQuery时间插件jquery.clock.js用法实例(5个示例)
2016/01/14 Javascript
高性能JavaScript循环语句和条件语句
2016/01/20 Javascript
纯前端JavaScript实现Excel IO案例分享
2016/08/26 Javascript
jQuery扩展+xml实现表单验证功能的方法
2016/12/25 Javascript
jQuery插件HighCharts实现的2D堆条状图效果示例【附demo源码下载】
2017/03/14 Javascript
js学习总结之DOM2兼容处理顺序问题的解决方法
2017/07/27 Javascript
实例分析JS与Node.js中的事件循环
2017/12/12 Javascript
详解js删除数组中的指定元素
2018/10/31 Javascript
js实现简单的打印表格
2020/01/15 Javascript
如何解决jQuery 和其他JS库的冲突
2020/06/22 jQuery
python绘图库Matplotlib的安装
2014/07/03 Python
python实现跨文件全局变量的方法
2014/07/07 Python
win与linux系统中python requests 安装
2016/12/04 Python
Python openpyxl 遍历所有sheet 查找特定字符串的方法
2018/12/10 Python
matplotlib实现热成像图colorbar和极坐标图的方法
2018/12/13 Python
Opencv实现抠图背景图替换功能
2019/05/21 Python
python 数据生成excel导出(xlwt,wlsxwrite)代码实例
2019/08/23 Python
Django自定义用户表+自定义admin后台中的字段实例
2019/11/18 Python
Python基础类继承重写实现原理解析
2020/04/03 Python
Python Opencv中用compareHist函数进行直方图比较对比图片
2020/04/07 Python
Python request操作步骤及代码实例
2020/04/13 Python
Python基于unittest实现测试用例执行
2020/11/25 Python
HTML5新标签兼容——&gt; 的两种方法
2018/09/12 HTML / CSS
三年级语文教学反思
2014/02/01 职场文书
仲裁协议书
2014/09/26 职场文书
法院干警四风问题自我剖析材料
2014/09/29 职场文书
预备党员考察表党小组意见
2015/06/01 职场文书
董事长年会致辞
2015/07/29 职场文书
2019公司管理制度
2019/04/19 职场文书