📄 day4_7.html
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312-80">
<style type="text/css">
<!--
a:link { color: blue; text-decoration: none}
a:visited { color: purple; text-decoration: none}
a:hover { color: #CC0033; text-decoration: underline}
-->
</style>
<title>JavaScript高级教程</title>
<script language="JavaScript">
<!-- hide me
// here are some global variables
var pet1;
var pet2;
var the_time_out;
var min_health = 0;
function Pet(the_pet_name, the_form_number)
{
this.age = 0;
this.hunger = Math.random() * 5; // random number between 0 and 4.99
this.health = Math.random() * 5 + 2 ; // random number between 2 and 6.99
this.happiness = Math.random() * 5;
this.pet_name = the_pet_name;
this.form_number = the_form_number;
this.feed = feed;
this.play = play;
this.medicate = medicate;
this.display = display;
this.makeOlder = makeOlder;
window.document.forms[the_form_number].pet_name.value = the_pet_name;
this.display();
}
function feed()
{
var meal_quality = Math.random() * 2;
this.hunger = this.hunger - meal_quality;
if (this.hunger < 0)
{
this.hunger = 0;
}
this.display();
}
function play()
{
var play_quality = Math.random() * 2;
this.happiness = this.happiness + play_quality;
this.display();
}
function medicate()
{
var max_health = 5; // if the pet is this healthy, medicine won't help
var med_quality = Math.random() * 1;
if (this.health + med_quality < max_health)
{
this.health = this.health + med_quality;
} else {
this.health = max_health;
}
}
function display()
{
var the_string = "";
if (this.health < min_health)
{
the_string = this.pet_name + " IS DEAD!";
} else {
the_string += "Happiness " + parseInt(this.happiness);
the_string += ". Health: " + parseInt(this.health);
the_string += ". Hunger: " + parseInt(this.hunger);
the_string += ". Age: " + parseInt(this.age);
the_string += ".";
}
window.document.forms[this.form_number].pet_status.value = the_string;
}
function makeOlder()
{
var max_hunger = 5;
var good_happiness = 5;
if (this.health > min_health)
{
this.age +=1;
this.happiness -= Math.random() * 2;
this.hunger += Math.random() * 2;
if (this.hunger > max_hunger)
{
this.health -= Math.random() * 2;
this.happiness -= Math.random() * 2;
}
if (this.health <0)
{
this.happiness -= Math.random() * 2;
}
if (this.hunger < 0)
{
this.hunger = 0;
}
if (this.happiness > good_happiness)
{
this.health += Math.random() *2;
}
}
this.display();
}
function start()
{
pet1 = new Pet("barney",2);
pet2 = new Pet("betty",3);
moveTime();
}
function moveTime()
{
pet1.makeOlder();
pet2.makeOlder();
the_time_out = setTimeout("moveTime();", 3000);
}
// show me -->
</script>
</head>
<body topmargin="1" leftmargin="2">
<table border="0" width="591" cellspacing="0">
<tr>
<td bgcolor="#ffff99" width="451">JavaScript高级教程 - 第四课</td>
</tr>
<tr>
<td bgcolor="#FF6600" width="451"><a href="mailto:thau@wired.com">Thau</a></td>
</tr>
</table>
<div align="left">
<table border="0" width="630" cellspacing="0">
<tr>
<td width="458" valign="top" align="left" rowspan="2"><small><small><br>
</small></small><strong>第七页：<font size="3">你的面向对象的虚拟宠物</font></strong>
<p><font size="3"> </font></p>
<table border="0" cellpadding="0" cellspacing="0" width="451">
<tr>
<td width="451"><font size="3">你现在骄傲地拥有了不是一只而是两只虚拟宠物。你的责任就<br>
是让它们保持健康。如果它们的健康值低于零，它们就会死掉。<br>
按<font face="verdana, arial">start </font>钮可以赋予它们生命<font face="verdana, arial">.
</font></font></td>
</tr>
</table>
<table cellpadding="2" cellspacing="0" border="0" align="RIGHT" width="150">
<tr>
<td rowspan="3"></td>
</tr>
</table>
<table width="357">
<tr>
<td> <font face="helvetica, arial, sans-serif" size="2"></font><font face="verdana, arial" size="2">
<hr>
<form>
<p>Name:
<input type="text" name="pet_name" value size="20">
<br>
Status:
<input type="text" size="60" name="pet_status" value>
<br>
<input type="button" value="feed" onClick="pet1.feed();">
<input type="button" value="play" onClick="pet1.play();">
<input type="button" value="medicate" onClick="pet1.medicate();">
</p>
</form>
<form>
<p>Name:
<input type="text" name="pet_name" value size="20">
<br>
Status:
<input type="text" size="60" name="pet_status" value>
<br>
<input type="button" value="feed" onClick="pet2.feed();">
<input type="button" value="play" onClick="pet2.play();">
<input type="button" value="medicate" onClick="pet2.medicate();">
</p>
</form>
<form>
<p>
<input type="button" value="start" onClick="start();">
<input type="button" value="stop the madness!" onClick="clearTimeout(the_time_out);">
</p>
</form>
<hr>
</font>
<table border="0" cellpadding="0" cellspacing="0" width="449">
<tr>
<td width="449"> <font face="verdana, arial" size="2"></font><font size="3">也许你能猜到，我并不是个称职的宠物饲养员，我的可怜的<br>
宠物每次还没养大就死掉了。</font>
<p><font face="verdana, arial" size="2"></font><font size="3">虽然如此，这整个都是用对象编出来的。每个宠物都是宠物<br>
对象的一个实例。每个宠物具有以下属性：</font>
<ul>
<li> <font face="verdana, arial" size="3">health</font><font size="3">健康
</font></li>
<font size="3">
<li> <font face="verdana, arial">happiness</font>快乐 </li>
<li> <font face="verdana, arial">hunger</font>饥饿 </li>
<li> <font face="verdana, arial">age</font>年龄 </li>
<li> <font face="verdana, arial">pet_name</font>宠物的名字 </li>
<li> <font face="verdana, arial">form_number -</font>表单号<font face="verdana, arial">--</font>宠物所在的<font face="verdana, arial">HTML</font>表单号。
</li>
</font>
</ul>
<font size="3">
<p> <font face="verdana, arial"></font>下列方法能够影响这些属性：
</font>
<ul>
<font size="3">
<li> <font face="verdana, arial"><tt>play()</tt> - </font>增加快乐
</li>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -