<!--DOCTYPE html-->

<html>

<head>

<meta charset="utf-8" />

<style>

*{ text-align:center;}

input{ margin-top:30px; padding:10px 20px;}

#div1{ width:500px; height:300px; background:red; margin:10px auto;}

</style>

</head>

<body>

<input type="button" value="style" id="btn" />

<div id="div1"></div>

<script>

//获取非行间css样式

function getStyle(obj,attr){	//获取非行间样式，obj是对象，attr是值

	if(obj.currentStyle){	//针对ie获取非行间样式

		return obj.currentStyle[attr];

	}else{

		return getComputedStyle(obj,false)[attr];	//针对非ie

	};

};

//为对象写入/获取css样式

function css(obj,attr,value){	//对象，样式，值。传2个参数的时候为获取样式，3个是设置样式

	if(arguments.length == 2){	//arguments参数数组，当参数数组长度为2时表示获取css样式

		return getStyle(obj,attr);	//返回对象的非行间样式用上面的getStyle函数

	}else{

		if(arguments.length == 3){	//当传三个参数的时候为设置对象的某个值

			obj.style[attr] = value;

		};

	};

};

window.onload = function(){

	var oDiv = document.getElementById("div1");

	var oBtn = document.getElementById("btn");

	oBtn.onclick = function(){

		alert(getStyle(oDiv,"height"));

		css(oDiv,"background","green");

		alert(css(oDiv,"width"));

	};

};

</script>

</body>

</html>

　　

js获取非行间样式/定义样式的更多相关文章

  1. js获取非行间样式或定义样式

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

  2. JS获取非行间样式及兼容问题

    获取非行间样式: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. js获取非行间样式/写入样式（行间）

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

  4. JS获取非行间样式

    我们都知道用offset函数获取元素样式是一件很方便的事,但是offset只能获取行间样式,而无法获得非行间样式,这是它的瓶颈所在. 我们都知道js获取行间样式的方法,那么js是如何获取行距样式的呢? ...

  5. js 获取非行间样式

    1.getComputedStyle(nodeObj,false):该方法是BOM对象,第一个是要获取样式的节点对象:第二个可以写成任何的字符一般写成false或者null,这里最好是用false因为 ...

  6. JavaScript获取非行间样式/定义样式

    html节点的样式分为以下几种 (1)浏览器默认样式 (2)引用样式(引用外部css文件的样式.style标签内定义的样式) 引用外部css样式:<link rel="styleshe ...

  7. js和jquery中获取非行间样式

    样式又分为了行间样式和非行间样式.一般来说行间样式用的是比较少的,因为它能够作用的范围就只有一个元素,而非行间样式的作用范围可以是一类元素(即拥有相同德标签,或者说是有相同的类名,(当然id名不可能相 ...

  8. js兼容总结之获取非行间样式

    非行间样式案例 #div1 { width: 200px; height: 200px; background: red; } IE获取非行间样式 var oDiv = document.getEle ...

  9. 原生js提取非行间样式

    js用style属性可以获得html标签的样式,但是不能获取非行间样式,如何获取css的非行间样式呢,在低版本ie我们可以用currentStyle,在其他浏览器我们可以用getComputedSty ...

随机推荐

  1. qqq

    http://blog.sina.com.cn/s/blog_6f0774010100wawd.html http://www.2cto.com/kf/201302/189135.html http: ...

  2. TopFreeTheme精选免费模板【20130619】

    今天给大家推荐7款最新精选的WordPress主题和一个WooCommerce订单跟踪插件,如果你有更换自己博客主题的想法或者正要做自己的博客,不妨试试.一些是WordPress商业模板,但都可以免费 ...

  3. 【原创】Docker容器及Spring Boot微服务应用

    Docker容器及Spring Boot微服务应用 1 什么是Docker 1.1 Docker的出现 问题一:项目实施环境复杂问题 传统项目实施过程中经常会出现“程序在我这跑得好好的,在你那怎么就不 ...

  4. android get uuid获取uuid

    https://github.com/Paldom/UniqueDeviceID protected void getDeviceUUID(){ try { Context context = cor ...

  5. Android内存管理之道

    相信一步步走过来的Android从业者,每个人都会遇到OOM的情况.如何避免和防范OOM的出现,对于每一个程序员来说确实是一门必不可少的能力.今天我们就谈谈在Android平台下内存的管理之道,开始今 ...

  6. spring的annotation-driven配置事务管理器详解

    http://blog.sina.com.cn/s/blog_8f61307b0100ynfb.html ——————————————————————————————————————————————— ...

  7. 使用CXF发布WebService服务简单实例

    一.说明: 前面介绍了使用axis2来发布Webservice服务,现在介绍一种更popular,更高效的Webservice服务发布技术:CXF Apache CXF = Celtix + XFir ...

  8. hdoj 5391 Zball in Tina Town

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5391 相关数论结论: 威尔逊定理——当且仅当p为素数时:( p -1 )! ≡ p-1 ( mod p ...

  9. Redis总结（五）缓存雪崩和缓存穿透等问题

    前面讲过一些redis 缓存的使用和数据持久化.感兴趣的朋友可以看看之前的文章,http://www.cnblogs.com/zhangweizhong/category/771056.html .今 ...

  10. Linux下生成动态链接库是否必须使用 -fPIC 的问题[转]

    在 Linux 下制作动态链接库,“标准” 的做法是编译成位置无关代码(Position Independent Code,PIC),然后链接成一个动态链接库.经常遇到的一个问题是 -fPIC 是不是 ...