MVHomework20181023
/
16-jq的获取和设置.html

<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title></title>
	<style>
		#box {
			width: 100px;
			height: 150px;
			background-color: red;
		}
	</style>
</head>

<body>
	<div id="box"></div>
	<script src="./jquery.js"></script>
	<script>
		//			console.log( $ )
		//			获取元素 宽度   css() 接受一个参数
		//			console.log( $("#box").css("width") );

		//			设置元素 宽度 css() 接受2个参数
		//			$("#box").css("width",400);

		//------------------------------------------
		function KK_ById(id) {
			return document.getElementById(id);
		}
		function css() {
			//Jquery写法
			// if (arguments.length === 3) {
			// 	return $(arguments[0]).css(arguments[1], arguments[2])
			// } else if (arguments.length === 2) {
			// 	return $(arguments[0]).css(arguments[1])
			// }
			//原生写法
			if (arguments.length === 3) {
				KK_ById(arguments[0]).style[(arguments[1])]= arguments[2]+'px';
			} else if (arguments.length === 2) {
				return getComputedStyle(KK_ById(arguments[0])).getPropertyValue(arguments[1]);
			} else {
				throw new Error('参数个数不对');
			}
		}

		console.log(css('box', "width")) // "100px"

		css('box', "width", 400);// 设置元素宽度 为 400px
	</script>
</body>

</html>