<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>创建对象显示自我介介绍</title>
<style>
body{font-size: 14px; font-family: "Arial", "微软雅黑"; line-height: 28px;}
</style>
</head>
<body>
<div id="intro"></div>
<script>
var student=new Object();
student.name="高乐乐";
student.age=15;
student.intro="我叫高乐乐,我是一个初中三年级的学生,我非常喜欢音乐和打篮球";
student.showIntro=function(){
var str="姓名:"+this.name+"<br/>年龄:"+this.age+"<br/>自我介绍:"+this.intro;
return str;
}
document.getElementById("intro").innerHTML=student.showIntro();
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>创建构造函数显示自我介绍</title>
<style>
body{font-size: 14px; font-family: "Arial", "微软雅黑"; line-height: 28px;}
</style>
</head>
<body>
<div id="intro"></div>
<script>
function Student(name,age,intro){
this.name=name;
this.age=age;
this.intro=intro;
this.showIntro=showIntro;
}
function showIntro(){
var p=document.createElement("p");
var str="姓名:"+this.name+"<br/>年龄:"+this.age+"<br/>自我介绍:"+this.intro;
p.innerHTML=str;
return p;
}
var student1=new Student("王小明",16,"我是高中一年级的学生,身高1.8米,很帅,我喜欢学习语文和英语。");
var student2=new Student("黄妞妞",6,"我今年6岁了,常可爱,马上就可以上小学了,就可能有好多好多的小朋友了。");
document.getElementById("intro").appendChild(student1.showIntro());
document.getElementById("intro").appendChild(student2.showIntro());
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>使用继承</title>
<style>
body{font-size: 14px; font-family: "Arial", "微软雅黑"; line-height: 28px;}
</style>
</head>
<body>
<div id="intro"></div>
<script>
function Animal(nama,color,age){
this.name=nama;
this.color=color;
this.age=age;
}
function Poultry(name,color,age,leg){
Animal.call(this,name,color,age); //继承属性
this.leg=leg;
}
Poultry.prototype=new Animal(); //继承方法
Poultry.prototype.info=function(){
var p=document.createElement("p");
var str="我是一个"+this.color+"的"+this.name+",我已经"+this.age+"岁了,我有"+this.leg+"条腿";
p.innerHTML=str;
return p;
};
var poultry1=new Poultry("小狗狗","灰色",1,4);
var poultry2=new Poultry("茶杯猫","白色",2,4);
var poultry3=new Poultry("母鸡","红色",1,2);
document.getElementById("intro").appendChild(poultry1.info());
document.getElementById("intro").appendChild(poultry2.info());
document.getElementById("intro").appendChild(poultry3.info());
</script>
</body>
</html>