小仙女—快速入门javescript基础

最新推荐文章于 2021-07-05 07:52:02 发布

原创最新推荐文章于 2021-07-05 07:52:02 发布 · 645 阅读

本内容遵循CC 4.0 BY-SA版权协议

入门快速javescript基础

这是演示开关灯的代码

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
	
<script>
function changeImage()
{
	element=document.getElementById('myimage')
	if (element.src.match("bulbon"))
 	{
  		element.src="/images/pic_bulboff.gif";
  	}
	else
   {
  		element.src="/images/pic_bulbon.gif";
   }
}
</script>
<img id="myimage" onclick="changeImage()"
src="/images/pic_bulboff.gif" width="100" height="180">
<p>点击灯泡就可以打开或关闭这盏灯</p>
	
</body>
</html>

这是基本的提示代码

			function n(){
			alert("are you sure");//警告
			}
			function m(){
			prompt("are you ken");
			
			}
			function bb(){
			alert(confirm("are you su"));//确认
			}

			<body>

			<input type="text"  value="点点" ondblclick="n()"/>
     		<input type="text"  value="点点1" onclick="m()"/>
     		 <input type="text"  value="点点2" onclick="bb()"/>

			<body>

alert:

alert

Prompt:

Prompt

Confirm:

Confirm

这是点击换图代码

		function b(){
		var email =	document.getElementById("email");
			
			alert(email.value);
			alert(email.type);
			}
			function c(){
		var tip1 =	document.getElementById("tip1");
			
			alert("图片的"+tip1.id);
			alert("图片的"+tip1.src);
			tip1.src="Img/2.jpg";
			alert("图片的"+tip1.src);
			
			}

			<body>
			<p>
      			<input type="button"  value="点点2" onclick="b()"/>
     		        <input type="text"   id="email"/>
     		 </p>
     
     		 <p>
      			<div>
      			 	<input type="button"  value="点点3" onclick="c()"/>
      				 <img src="Img/1.png" id="tip1"></img>
					<img src="Img/2.jpg"></img>
				</div>
     		 </p>

			</body>

又标题党了