深入JS1.1

最新推荐文章于 2022-11-25 12:52:05 发布

原创最新推荐文章于 2022-11-25 12:52:05 发布 · 263 阅读

CC 4.0 BY-SA版权

函数返回值

无参

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>函数返回值</title>
		<script>
			function add()
			{
				return 'acs';
			}
			alert(add());
		</script>
	</head>
</html>

有参数，返回加法

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>函数返回值</title>
		<script>
			function add(a,b)
			{
				return a+b;
			}
			alert(add( 3, 4));
		</script>
	</head>
</html>

返回空值情况

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>函数返回值</title>
		<script>
			function add(a,b)
			{
				return;
			}
			alert(add( 3, 4));
		</script>
	</head>
</html>

用arguments处理不定参的情况

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>函数返回值</title>
		<script>
			function add()
			{
				var sum=0;
				for(var i=0;i<arguments.length;i++)
					sum+=arguments[i];
				return sum;
			}
			alert(add( 3, 4, 5));
		</script>
	</head>
</html>

获取非行间样式

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>返回样式</title>
		<script>
		function getStyle(obj, name)
		{
			if(obj.currentStyle)
			{
				return obj.currentStyle[name];
			}
			else{
				return getComputedStyle(obj, false)[name];
			}
		}
			window.onload=function ()
			{
				var oDiv=document.getElementById('div1');

				alert(getStyle(oDiv, 'width'));
			};
		</script>
	</head>
	<body>
		<div id='div1' style="height:200px; width:200px; background:red" >
			
		</div>
	</body>
</html>

同一函数区别参数个数实现获取样式和设置样式

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>样式函数</title>
		<script>
		function css(obj, name, value)
		{
			if(arguments.length==2)
			{
				return obj.style[name];
			}
			else{
				obj.style[name]=value;
			}
		}
		window.onload=function()
		{
			var oDiv=document.getElementById('div1');

			//alert(css(oDiv, 'width'));
			css(oDiv, 'background', 'green');
		};
		</script>
	</head>
	<body>
		<div id='div1' style="height:200px; width:200px; background:red" >
			
		</div>
	</body>
</html>