JQuery高效制作网页特效第四章初识面向对象课后作业

45 阅读 0 评论 30 点赞

我是靠谱客的博主留胡子路灯，最近开发中收集的这篇文章主要介绍JQuery高效制作网页特效第四章初识面向对象课后作业，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

			JQuery高效制作网页特效第四章初识面向对象课后作业
1，创建对象显示自我介绍
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>创建对象显示自我介绍</title>
    <style>
        #nb{
            width: 300px;
            line-height: 30px;
        }
    </style>
</head>
<body>
    <div id="nb"></div>
<script>
    var person=new Object();
    person.name="高乐乐";
    person.age="18";
    person.work="我叫高乐乐，我是一个初中三年级的学生，我非常喜欢音乐和打篮球。"
    person.show=function () {
        var str="姓名："+this.name+"<br>年龄："+this.age+"<br>自我介绍："+this.work;
        document.getElementById("nb").innerHTML=str;
    }
    person.show();

</script>
</body>
</html>

2，创建构造函数显示自我介绍
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>创建构造函数显示自我介绍</title>
</head>
<body>
<div id="sb"></div>
<script>
    function Student(name,age,introduction) {
        this.name=name;
        this.age=age;
        this.introduction=introduction;
        this.show=function () {
            var str="姓名："+this.name+"<br>年龄："+this.age+"<br>自我介绍："
                +this.introduction;
            var aaa=document.createElement("p");
            aaa.innerHTML=str;
            document.getElementById("sb").appendChild(aaa);

        }
    }
    var person1=new Student("王小明","16",
        "我是一名高中一年级学生，身高1.8米，很帅，我很喜欢语文和数学")
    person1.show()
    var person2=new Student("黄妞妞","3",
        "非常可爱，马上就可以上小学了，就可能有好多好多的小朋友了")
    person2.show();
</script>
</body>
</html>

3，使用继承
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>使用继承</title>
</head>
<body>
<div id="sb"></div>
<script>
    function Animal(name,age,color) {
        this.name=name;
        this.age=age;
        this.color=color;
    }
    Animal.prototype.showName=function () {
        return this.name;
    }
    Animal.prototype.showAge=function () {
        return this.age;
    }
    Animal.prototype.showColor=function () {
        return this.color;
    };
    function Poultry(color,name,age,leg) {
        Animal.call(this,name,age,color);
        this.leg=leg;
    }
    Poultry.prototype=new Animal();
    Poultry. prototype.showInfo=function () {
        var aaa="我是一个"+this.color+"的"+this.name+",我已经"+this.age+
            "岁了，我有"+this.leg+"条腿";
        var bbb=document.createElement("p");
        document.getElementById("sb").appendChild(bbb).innerHTML=aaa;
    }
    var Dog=new Poultry("灰色","小狗狗",1,4);
    Dog.showInfo();
    var Cat=new Poultry("白色","茶杯猫",2,4);
    Cat.showInfo();
    var Chicken =new Poultry("红色","母鸡",1,2);
    Chicken.showInfo();

</script>
</body>
</html>