<!--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. 9段高效率开发PHP程序的代码

    php是世界上最好的语言 在php网站开发中,大家都希望能够快速的进行程序开发,如果有能直接使用的代码片段,提高开发效率,那将是起飞的感觉.今天由杭州php工程师送出福利来了,以下9段高效率开发PHP ...

  2. Google Test资料

    Google Test资料 玩转Google开源C++单元测试框架Google Test系列(gtest)(总) gtest.h file not found googletest xcode 7.0 ...

  3. CameraComponent Quality

    CameraComponent1.Quality := TVideoCaptureQuality.HighQuality; procedure TCameraComponentForm.Set720p ...

  4. KMP算法——Javascript实现

    腾讯和阿里的笔试刚过去了,里面有很多题都很值得玩味的.之前Blog积累的很多东西,还要平时看的书,都有很大的帮助.这个深有体会啊! 例如,腾讯有一道算法题是吃香蕉(好邪恶的赶脚..),一次吃一根或者两 ...

  5. 【破解三网】iphone5 国行 A1429

    教程仅适用于A1429的I5. 1.首先把sim卡插入手机.关闭蜂窝数据里面的"蜂窝移动数据"还有打开漫游里面的"语音漫游".如图               ...

  6. Dell商用台式机、笔记本、服务器800电话

    戴尔Optiplex商用台式机 售后服务电话 800-858-0950 选1选2选2 戴尔Latitude商用笔记本 售后服务电话 800-858-0950 选1选3选2 戴尔服务器PowerEdge ...

  7. GC：垃圾回收器简介

    Java堆内存被划分为新生代和年老代两部分,新生代主要使用复制和标记-清除垃圾回收算法,年老代主要使用标记-整理垃圾回收算法,因此java虚拟中针对新生代和年老代分别提供了多种不同的垃圾收集器,JDK ...

  8. Linux目录介绍

    /: 根目录,一般根目录下只存放目录,不要存放文件,/etc./bin./dev./lib./sbin应该和根目录放置在一个分区中/bin:/usr/bin: 可执行二进制文件的目录,如常用的命令ls ...

  9. oracle表空间建立与用户创建删除

    --创建临时表空间 --//Linux下的文件系统 create temporary tablespace cloudv2_temp tempfile '/home/oracle/app/oracle ...

  10. Linq使用Group By经验总结

    1.计数 var q = from p in db.Products group p by p.CategoryID into g select new { g.Key, NumProducts = ...