老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)

来源：动视网责编：小采时间：2020-11-27 22:07:20

老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)

老生常谈JavaScript获取CSS样式的方法(兼容各浏览器):众所周知，CSS样式有三种类型：行内样式、内部样式和外部样式，JavaScript获取CSS样式时分为两种情况：行内样式获取法和非行内样式获取法。一、行内样式获取相对简单，通过element.style.attr（元素.style.属性）即可获取，示例： <!DOCT

推荐度：

点击下载本文 文档为doc格式

导读老生常谈JavaScript获取CSS样式的方法(兼容各浏览器):众所周知，CSS样式有三种类型：行内样式、内部样式和外部样式，JavaScript获取CSS样式时分为两种情况：行内样式获取法和非行内样式获取法。一、行内样式获取相对简单，通过element.style.attr（元素.style.属性）即可获取，示例： <!DOCT

众所周知，CSS样式有三种类型：行内样式、内部样式和外部样式，JavaScript获取CSS样式时分为两种情况：行内样式获取法和非行内样式获取法。

一、行内样式获取相对简单，通过element.style.attr（元素.style.属性）即可获取，示例：

 <!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="UTF-8">
 <title>JavaScript获取CSS样式</title>
 </head>
 <body>
 <!-- 给p标签设置行内样式并添加点击事件 -->
 <p style='width: 200px;height: 100px;background: pink' onclick='show()'>博客园--开发者的网上家园</p>
 <script type="text/javascript">
 function show() {
 var obj = document.getElementsByTagName('p')[0];
 alert(obj.style.width);
 }
 </script>
 </body>
 </html>

运行：