JavaScript获取外部CSS属性方法介绍

最新推荐文章于 2019-09-05 00:38:23 发布

iteye_3606

最新推荐文章于 2019-09-05 00:38:23 发布

阅读量144

点赞数

文章标签： javascript ViewUI

本文介绍了如何在JavaScript中获取外部CSS样式表中指定元素的宽度、高度等属性值，通过实例演示了如何利用getElementById方法获取DOM元素并使用offsetHeight和offsetWidth属性获取元素的实际尺寸。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在HTML代码中，如果对于一个标签，你在其中写上style属性对其进行描述，这样的话，使用JS获取他的属性只需

要div.style.height就可以了。但是对于外部CSS就不能了，下面介绍外部CSS属性获取方法。

CSS如下

#div1{ width: 500px; height: 200px; background-color: pink; }
HTML如下

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>test1.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" href="../css/5.css" type="text/css"></link> <script type="text/javascript"> function test(){ var div = document.getElementById("div1"); window.alert(div.offsetHeight); window.alert(div.offsetWidth); } </script> </head> <body> <div id="div1">div1</div> <input type="button" οnclick="test();" value="测试"> </body> </html> 其实就是一句话div.offsetHeight这句话。很经典，Mark一下