JavaScript——宠物狗

最新推荐文章于 2023-03-02 22:34:04 发布

UESTC_mkm

最新推荐文章于 2023-03-02 22:34:04 发布

阅读量731

点赞数

分类专栏： JavaScript 文章标签： JavaScript

本文链接：https://blog.csdn.net/weixin_41044542/article/details/78521984

版权

JavaScript 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

今天是开始学习JavaScript的第一天，准备做宠物狗的交互式页面。
一：为页面添加换用信息
// 1：第一次载入网页的时候，第一项问题关系到响应一个事件，第二项问题是 JavaScript的消息提示框有关。
    2：onload事件，在浏览器完后网页的载入时触发。onload使用的源代码，在<body>标签里面。onload指出网页已完成载入。
<body οnlοad="alert('hello,I am your pet');">
    3：alert（）函数告知浏览器呈现一个alert框。
alert( 'text to  display' );

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title></title>
		<script type="text/javascript">//type适用于分辨使用脚本的语言
			function touchdog(){
				var userName = prompt("What is your name?","enter your name here");
				if(userName){
					alert("it is good to meet you" + userName + ".");//取了名字之后，会显示欢迎信息 。
					document.getElementById("dog").src="img/d_tiaopi.png";//把图片改成调皮的图片
				}
			}//pointer是当鼠标移到图片上时变为手掌。 狗狗的onclick属性使得touchdog（）函数于点击是受到调用。
		</script>
	</head>
	<body οnlοad="alert('hello,i am your pet')";>
		<div style="margin-top: 100px;text-align: center;">	
		
		<img id="dog" src="img/d_guaiqiao.png" alt="index" style="cursor: pointer" οnclick="touchdog()"> 
		</div>
	</body>
</html>

总结与分析：主要是函数的调用和函数的设置