js 获取DOM的style属性
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>计算元素样式</title>
<style type="text/css">
#myDiv
{
background-color: blue;
width: 100px;
height: 200px;
}
</style>
</head>
<body>
<div id="myDiv" style="background-color: red; border: 1px solid black">
</div> <script type="text/javascript"> var myDiv = document.getElementById("myDiv");
alert(getStyle(myDiv,"backgroundColor"));//"red" 或 rgb(255,0,0)
alert(getStyle(myDiv,"width")); //"100px"
alert(getStyle(myDiv,"height")); //"200px"
alert(getStyle(myDiv,"border")); //在某些浏览器中是“1px solid black”
//var computedStyle = document.defaultView.getComputedStyle(myDiv, null);
//alert(computedStyle.backgroundColor); //"red"
//alert(computedStyle.width); //"100px"
//alert(computedStyle.height); //"200px"
//alert(computedStyle.border); //在某些浏览器中是“1px solid black” //获取DOM的style属性
function getStyle(obj,attr)
{
if(obj.currentStyle) //用于IE
{
return obj.currentStyle[attr];
}
else
{
// document.defaultView.getComputedStyle 该方法时DOM2中才出现的方法
return document.defaultView.getComputedStyle(myDiv, null)[attr];
//getComputedStyle DOM1中的方法
//return getComputedStyle(obj,false)[attr];
}
} </script> </body>
</html>
js 获取DOM的style属性的更多相关文章
- js获取dom对象style样式的值
js获取到的dom对象的style通常是没有值得,因为我们都写在外部文件中,从慕课网上见到讲师封装的一个方法,挺不错.特此记录下来. function getStyle(obj,attr){ if(o ...
- JS1 js获取dom元素方法
js获取dom元素方法 1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId") 其 ...
- JS获取DOM元素的八种方法
JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...
- js 获取和设置css3 属性值的实现方法
众多周知 CSS3 增加了很多属性,在读写的时候就没有原先那么方便了. 如:<div style="left:100px"></div> 只考虑行间样式的话 ...
- 原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离
关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position() ...
- 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题
1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...
- vue 获取dom的css属性值
<template> <div id="topInfo" ref="topInfo" style="width: 200px;hei ...
- js获取一个对象的所以属性和值
在HTML DOM中,获取某个元素对象的时候,往往记不住它的很多属性,可以通过下面的例子来查找一下: <!DOCTYPE html> <html> <body> & ...
- js 获取html5的data属性
我以前一直以为只能用jquery的data()来获取 哈哈 是我太弱了 <!DOCTYPE html> <html> <head> <title>dat ...
随机推荐
- 反编译微信小程序
最近看了个微信小程序古诗词全集,想知道他的前后端是怎么实现的,所以就想到了反编译.小程序安装后会有个wxapkg格式的文件存在/data/data/com.tencent.mm/MicroMsg/** ...
- 将字符串以用二进制流的形式读入XML文件
其实将字符串写入XML文件本身并不复杂,这里只是写一些需要注意的地方,特别是编码格式,这里需要的是XML默认的编码方式是UTF-8,在对字符串进行编码的时候一定要注意, string strRecei ...
- Ubuntu 16.04安装Eclipse
此篇为http://www.cnblogs.com/EasonJim/p/7139275.html的分支页. 前提:必须正确安装JDK和Tomcat. 下载: https://www.eclipse. ...
- Hadoop 入门
我看过的比较全的文章.赞一下 原文链接:http://www.aboutyun.com/thread-8329-1-1.html 问题导读: 1.hadoop编程需要哪些基础?2.hadoop编程需要 ...
- day25 初始面向对象
类 有具体规范,无具体值对象 有具体的值 dict 类d = {"":""} 对象 自定义一个类格式: class 类名: # 可以跟()或者不跟 属性 = ' ...
- nginx 深入篇
nginx 防盗链 上文介绍了如何以最最简单的方式配置静态资源,还存在一定的隐患,一般的盗链如何预防, 设置验证referer server { listen 8000; server_name 12 ...
- POSIX 线程取消点的 Linux 实现
http://blog.csdn.net/stevenliyong/article/details/4364039 原文链接:http://blog.solrex.cn/articles/linux- ...
- A1071. Speech Patterns
People often have a preference among synonyms of the same word. For example, some may prefer "t ...
- A1095. Cars on Campus
Zhejiang University has 6 campuses and a lot of gates. From each gate we can collect the in/out time ...
- mod(%)之规律(除数与被除数的正负分析)
首先注意“-9 % 4”,根据运算符优先级,负号运算符优先级大于余数(取模),所以执行的是“(-9) % 4”. 其次 % = mod ,只是在不同地方表示方法不同而已. 被除数无论是正数和负数结果都 ...