模拟jQuery库，实现图片的隐藏和显

1.jsp

<img src="images/A~55)18]@]MC92F1L6`N90K.png"></img>
<input id="hide" type="button" value="隐藏">
<input id="show" type="button" value="显示">
<script type="text/javascript">
	function $(str) {
		document.getElementById(str).onclick = function() {
			var img = document.images[0];
			if ("hide" == str) {
				img.style.visibility = "hidden";
			}
			if ("show" == str) {
				img.style.visibility = "visible";
			}
		}
	}
</script>

<script type="text/javascript">
	$("hide");
	$("show");
</script>

将第一个js的代码放进新建的js文件

2.js

//显示和隐藏图片
function $(str) {
	document.getElementById(str).onclick = function() {
		var img = document.images[0];
		if ("hide" == str) {
			img.style.visibility = "hidden";
		}
		if ("show" == str) {
			img.style.visibility = "visible";
		}
	}
}

在1.jsp中引入2.js

<script type="text/javascript" src="js/2.js"></script>
	<img src="images/A~55)18]@]MC92F1L6`N90K.png"></img>
	<input id="hide" type="button" value="隐藏">
	<input id="show" type="button" value="显示">
	<script type="text/javascript">
		$("hide");
		$("show");
	</script>

这样就很大程度的减少了代码量，提高了效率