javascript初学总结_5

最新推荐文章于 2018-09-15 10:22:28 发布

jieni_

最新推荐文章于 2018-09-15 10:22:28 发布

阅读量235

点赞数 1

分类专栏： js

本文链接：https://blog.csdn.net/lovedbaobao/article/details/53046740

版权

js 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<html>
<head>
<title>css函数</title>
<style type="text/css">
#div1 {width:200px;height:200px;background:red;}
</style>

<script type="text/javascript">
function getStyle(obj,arr)
{
	if(obj.currentStyle)
	{
		return obj.currentStyle[arr];//返回obj对象里arr属性的值
	}
	else
	{
		return getComputedStyle(obj,null)[arr];
	}
}

function css(obj,arr,value)
{
	if(arguments.length==2)
	{
		return getStyle(obj,arr);//获取属性值
	}
	else if(arguments.length==3)
	{
		obj.style[arr]=value;//设置属性值
	}
}

window.οnlοad=function()
{
	var oDiv=document.getElementById('div1');
	var oBtn=document.getElementById('btn1');
	oBtn.οnclick=function()
	{
		alert(css(oDiv,'backgroundColor'));
	}
}
</script>
</head>

<body>
<button id="btn1" type="button">提交</button>
<div id="div1"></div>

</body>
</html>

收获：

1.实参的个数不必等于形参的个数

2.style对象可用于修改属性值和获取属性值，但在获取属性值时只返回通过style标签属性应用到元素的内嵌样式；

3.currentStyle对象代表了在全局样式表、内嵌样式表和HTML标签属性中指定的对象格式和样式，即会返回指定元素上所有的样式值，当其中的一个样式有多种，如color有red,green时，会返回最具资格的一个属性值，不可以改变属性值，且只有IE支持；

4.Window.getComputedStyle()方法得出所有在应用有效的样式和分解任何可能会包含值的基础计算后的元素的CSS属性值。getComputedStyle 返回的对象跟 element 调用 style 属性返回的对象是同一种类型，但getComputedStyle返回的对象是只读对象，不可修改其属性值；

jieni_

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript初学总结_5

css函数#div1 {width:200px;height:200px;background:red;}function getStyle(obj,arr){ if(obj.currentStyle) { return obj.currentStyle[arr];//返回obj对象里arr属性的值 } else { return getComputedStyle(
复制链接

扫一扫

专栏目录