Bug记录--第一天(蝼蚁虽小......)

  1. document not docunment ;
  2. var xx=document.getElementById("demo1);  //别看不起一对引号" " .
  3. 三目运算符的格式  -------表达式1?表达式2:表达式3;  //注意 : 是英文状态下的

JavaScript小案例----点击灯泡发光

<!DOCTYPE html>
<html>
 <head>
   <meta charset="UTF-8">
   <title>灯泡闪亮</title>
 </head>
   <body>
	<img id="demo1" onClick="light()" src="js/pic_bulboff.gif" />
	<p>点击灯泡可放光</p>
	<script>
	    function light(){
		var xx=document.getElementById("demo1");
		 if(xx.src.match("bon")){
		   xx.src="js/pic_bulboff.gif" ;
		 }else{
		   xx.src="js/pic_bulbon.gif" ;
		}
	    }
	</script>
   </body>
</html>

还可以这样写:

<!DOCTYPE html>
<html>
 <head>
   <meta charset="UTF-8">
   <title>灯泡闪亮</title>
 </head>
   <body>
	<img id="demo1" onClick="light()" src="js/pic_bulboff.gif" />
	<p>点击灯泡可放光</p>
	<script>
	    function light(){
		var xx=document.getElementById("demo1");
		xx.src=xx.src.match("bon")?"js/pic_bulboff.gif":"js/pic_bulbon.gif";
	    }
	</script>
   </body>
</html>

运行结果:

猜你喜欢

转载自blog.csdn.net/Smtime826/article/details/84398487