JavaScript第4章简答题5(创建一个构造函数Animal,使用继承完成如下要求:)

思卿不见

已于 2022-05-25 16:16:14 修改

阅读量2.3k

点赞数 1

文章标签： javascript

于 2019-06-02 10:41:36 首次发布

本文链接：https://blog.csdn.net/weixin_44100210/article/details/90736939

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>创建一个构造函数Animal</title>
</head>
<body>
<div id="title"></div>
<script type="text/javascript">
    function Animal(color,name) {     //创建构造函数Animal,添加自己的属性
        this.color=color;
        this.name=name;
    }
    function Poultry(color,name,age,leg) {      //创建构造函数Poultry
        Animal.call(this,color,name);       //使用call()继承Animal的属性
        this.age=age;        //并添加自己的属性
        this.leg=leg;
    }
    Poultry.prototype=new Animal();          //继承了Animal
    Poultry.prototype.info=function () {        //创建方法info
        var p=document.createElement("p");       //使用createElement()创建p标签
        p.innerHTML="<br>我是一个"+this.color+"的"+this.name+",我已经"+this.age+"岁了,我有"+this.leg+"条腿<br>";      //使用innerHTML把内容显示在此p标签中
        return p;      //使用return返回p标签
    }
    var p1=new Poultry("灰色","小狗狗",1,4);     //使用new创建对象
    var p2=new Poultry("白色","茶杯猫",2,4);
    var p3=new Poultry("红色","母鸡",1,2);
    document.getElementById("title").appendChild(p1.info());      //使用getElement()和appendChild()把创建的对象信息追加到页面中
    document.getElementById("title").appendChild(p2.info());
    document.getElementById("title").appendChild(p3.info());
</script>
</body>
</html>

ps:效果图如下:
在这里插入图片描述