前端 JS基础理论总结（九）

闭包存循环的索引值

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>闭包存循环的索引值</title>
	<style type="text/css">
		li{
			height: 30px;
			background-color: gold;
			margin-bottom: 10px;
		}
	</style>
	<script type="text/javascript">
		//闭包的用途：存循环的索引值
		window.onload = function(){
			var aLi = document.getElementsByTagName('li');
			// alert(aLi.length);//8

			for(var i=0; i<aLi.length; i++){
				/*
				aLi[i].onclick = function(){
					alert(i);//每个li都弹出8，因为点击时循环已完毕，i最后为8
				}
				*/

				(function(k){//这里的k是形参
					aLi[k].onclick = function(){
						alert(k);//弹出每个li的索引值
					}
				})(i);//这里的i是实参
			}
		}
	</script>
</head>
<body>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
		<li>5</li>
		<li>6</li>
		<li>7</li>
		<li>8</li>
	</ul>
</body>
</html>

闭包做私有变量计算器

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>闭包做私有变量计数器</title>
	<script type="text/javascript">
		//闭包的用途：私有变量计数器
		var count = (function(){
			var a = 0;

			function bb(){
				a++;
				return a;
			}

			return bb;
		})();
		
		//每调用一次count，a就自增一次
		alert(count());//1
		alert(count());//2

		var c = count();
		alert(c);//3
	</script>
</head>
<body>
	
</body>
</html>

获取地址栏参数

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>获取地址栏参数</title>
	<script type="text/javascript">

		window.onload = function(){
			//url？aa=tom#12
			var data = window.location.search;//？aa=tom
			var hash = window.location.hash;//#12
			alert(hash);//#12

			var oSpan = document.getElementById('span01');
			// alert(data);//？aa=tom

			var arr = data.split('=');
			// alert(arr);//?aa,tom

			var name = arr[1];
			oSpan.innerHTML = name;
		}
	</script>
</head>
<body>
	<div>欢迎<span id="span01"></span>访问我的主页</div>
</body>
</html>

Math

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Math</title>
	<script type="text/javascript">
		// var num = Math.random();
		// alert(num);//弹出0-1之间的随机数

		var a = 10;
		var b = 20;
		// var num = Math.random()*(b-a)+a;
		// alert(num);//弹出10-20之间的随机数

		var arr = [];
		for(var i=0; i<20; i++){
			// var num = Math.floor(Math.random()*(b-a)+a);//向下取整，10-19
			var num = Math.floor(Math.random()*(b-a + 1)+a);//向下取整，10-20
			
			arr.push(num);//生成一个数就放进数组
		}
		alert(arr);//17,20,20,11,11,19,17,16,10,11,16,11,18,13,13,11,17,14,19,19
	</script>
</head>
<body>
	
</body>
</html>

前端 JS基础理论总结（九）

闭包存循环的索引值

闭包做私有变量计算器

获取地址栏参数

Math

猜你喜欢