JavaScript OOP练习第一弹(1 位领导批示)

学javascript已经有一段时间了,成天与DOM,文档对像打交道,水平停滞不前.今天来进阶练习,学习 javascript OOP 写了一点简单的代码

  1. <script type="text/javascript">
  2. /*定义宠物对像*/
  3. function Pet()
  4. {
  5.     //名称
  6.     this.name = null;
  7.     //毛色
  8.     this.color = null;
  9.     //设置名称
  10.     this.setName = function(newName)
  11.     {
  12.         this.name = newName;
  13.     };
  14.     //获取名称
  15.     this.getName = function()
  16.     {
  17.         return this.name;
  18.     };
  19.     //获取颜色
  20.     this.getColor = function()
  21.     {
  22.         return this.color;
  23.     };
  24.     //设置颜色
  25.     this.setColor = function(newColor)
  26.     {
  27.         this.color = newColor;
  28.     };
  29.     //定义一个要实现的方法
  30.     this.getFood = null;
  31.     //获取宠物对像的描述信息
  32.     this.showPet = function()
  33.     {
  34.         return this.color + "色的" + this.name + "最喜欢吃的食物是" + this.getFood();
  35.     }
  36. }
  37.  
  38. //定义狗狗对像
  39. function Dog() {
  40.     this.getFood = function()
  41.     {
  42.         return "骨头";
  43.     };
  44. }
  45.  
  46. //声明Dog的原型
  47. Dog.prototype = new Pet();
  48. </script>
  49.  
  50. <script type="text/javascript">
  51. //实例化一只名叫koko的黄色小狗
  52. var mydog = new Dog();
  53. //设置koko的属性
  54. mydog.setName("koko");
  55. mydog.setColor("");
  56. //输出测试
  57. alert(mydog.showPet());
  58. </script>

第一次学习练习,难免浅显.见笑

练习 JS做的北京奥运会倒计时,精确到秒(0 位领导批示)

Demo http://www.zdyi.com/code/bj2008/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>北京2008奥运会开幕倒计时</title>
<style>
* {margin:0;padding:0;font-size:12px;font-family:Calibri, Arial, Helvetica, sans-serif;}
body,html {height:100%;}
#beijing2008 {text-align:center;height:100%;line-height:50;color:#333;margin:auto;}
</style>
</head>
<body>
<div id="beijing2008"></div>
<script>
var now = new Date();
function beijing2008()
{
	var iStart = new Date("8/08/2008 20:00:00");//设置奥运会开幕时间
	now.setTime(now.getTime() + 250);//修正误差
 
	days	= (iStart - now) / 1000 / 60 / 60 / 24;
	dayNum 	= Math.floor(days);//获取天数
	hours 	= (iStart - now) / 1000 / 60 / 60 - (24 * dayNum);
	houNum 	= Math.floor(hours);//获取小时
	if(houNum < 10){houNum = "0" + houNum}
	minutes = (iStart - now) / 1000 / 60 - (24 * 60 * dayNum) - (60 * houNum);
	minNum	= Math.floor(minutes);//获取分钟
	if(minNum < 10){minNum = "0" + minNum};
	seconds	= (iStart - now) / 1000 - (24 * 60 * 60 * dayNum) - (60 * 60 * houNum) - (60 * minNum);
	secNum	= Math.floor(seconds);//获取秒钟
	if(secNum < 10){secNum = "0" + secNum};
 
	var show = document.getElementById("beijing2008");
	show.innerHTML = "距2008北京奥运会开幕还有&nbsp;" + dayNum + "&nbsp;天&nbsp;" + houNum + "&nbsp;时&nbsp;" + minNum + "&nbsp;分&nbsp;" + secNum + "&nbsp;秒" 
}
setInterval("beijing2008()",250);
</script>
</body>
</html>

随机显示的10篇日志

评论最多的10篇日志

浏览最多的10篇日志