切换导航
首页
技术问答
编程语言
前端开发
移动开发
开发工具
程序设计
行业应用
CMS系统
服务器
频道导航
▸ PHP
▸ Java
▸ Java SE
▸ Python
▸ C#
▸ C&C++
▸ Ruby
▸ VB
▸ asp.Net
▸ Go
▸ Perl
▸ netty
▸ Django
▸ Delphi
▸ Jsp
▸ .NET Core
▸ Spring
▸ Flask
▸ Springboot
▸ SpringMVC
▸ Lua
▸ Laravel
▸ Mybatis
▸ Asp
▸ Groovy
▸ ThinkPHP
▸ Yii
▸ swoole
▸ HTML
▸ HTML5
▸ JavaScript
▸ CSS
▸ jQuery
▸ Bootstrap
▸ Angularjs
▸ TypeScript
▸ Vue
▸ Dojo
▸ Json
▸ Electron
▸ Node.js
▸ extjs
▸ Express
▸ XML
▸ ES6
▸ Ajax
▸ Flash
▸ Unity
▸ React
▸ Flex
▸ Ant Design
▸ Web前端
▸ 微信小程序
▸ 微信公众号
▸ iOS
▸ Android
▸ Swift
▸ Hybrid
▸ Cocos2d-x
▸ Flutter
▸ Xcode
▸ Silverlight
▸ cocoa
▸ Cordova
前端之家
JavaScript
JavaScript中获取样式的原生方法小结
JavaScript中获取样式的原生方法小结
2018-12-31
JavaScript
前端之家
前端之家
收集整理的这篇文章主要介绍了
JavaScript中获取样式的原生方法小结
,
前端之家
小编觉得挺不错的,现在分享给大家,也给大家做个参考。
ps:是
获取
样式,不是设置样式。若没有给元素设置样式值,则返回浏览器给予的默认值。(论坛整理)
1、element.style:
只能
获取
写在元素
标签
中的style
属性
里的样式值,无法
获取
到定义在和通过
加载进来的样式
属性
代码
如下:
获取颜色
2、window.getComputedStyle():
可以
获取
当前元素所有最终使用的CSS
属性
值。
代码
如下:
这个
方法
接受两个参数:要取得计算样式的元素和一个伪元素字符串(例如“:before”) 。如果不需要伪元素信息,第二个参数可以是null。也可以通过document.defaultView.getComputedStyle(“元素”,“伪类”);来使用
代码
如下:
获取颜色
可以通过style.length来查看浏览器默认样式的个数。IE6-8
不支持
该
方法
,需要使用后面的
方法
。对于Firefox和Safari,会把颜色转换成rgb格式。
3、element.currentStyle:
IE 专用,返回的是元素当前应用的最终CSS
属性
值(
包括
外链
CSS
文件
,
页面
中嵌入的