请老师帮忙检查一下代码

来源:4-5 编程练习

激情的樱木花道

2021-07-02 15:34:19

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

        #wrap {

            width324px;

            margin0 auto;

        }

        button {

            padding10px 20px;

            margin-bottom20px;

            border: none;

            border-radius3px;

            background#f01414;

            color#fff;

        }

        #intro {

            width300px;

            min-height100px;

            line-height20px;

            padding10px;

            border2px solid gray;

            border-radius3px;

        }

    </style>

</head>

<body>

    <div id="wrap">

        <button id='btn'>添加</button>

        <div id="intro"></div>

    </div>

    <script>

        let intro=document.getElementById('intro');

        let btn=document.getElementById('btn');

        let add=obj=>{

            const yueguang= {

                name: "大话西游之月光宝盒 ",

                year: "2014",

                director: "刘镇伟",

                star: "周星驰 / 吴孟达 / 罗家英",

                type: "喜剧 / 爱情 / 奇幻 / 古装",

                introduction: " 孙悟空(周星驰)护送唐三藏(罗家英)去西天取经路上,与牛魔王合谋欲杀害唐三藏,并偷走了月光宝盒,此举使观音萌生将其铲除心思,经唐三藏请求,孙悟空被判五百年后重新投胎做人赎其罪孽...."            

            }

            const ase={...yueguang,...obj};

            intro.innerHTML=`<h2>${ase.name}</h2><p>导演:${ase.director}</p><p>主演:${ase.star}</p><p>类型:${ase.type}</p><p>上映年份:${ase.year}</p><p>简介:${ase.introduction}</p>`;

           

        }

        add();

        btn.onclick=()=>{

                const gongfu={

                name: "功夫 ",

                year: "2004",

                director: "周星驰",

                star: "周星驰 / 黄圣依",

                type: "周星驰 / 黄圣依",

                introduction: '20世纪40年代的中国广东,有一名无可救药的小混混阿星(周星驰饰),此人能言善道,擅耍嘴皮,但意志不坚 一事无成。他一心渴望加入手段冷酷无情,恶名昭彰的斧头帮,并梦想成为黑道响叮当的人物。此时斧头帮正倾全帮之力急欲铲平唯一未收入势力范围的地头....'

                }

                add(gongfu);

            }

    </script>

</body>

</html>


写回答

1回答

好帮手慕星星

2021-07-02

同学你好,代码实现效果可以。继续加油,祝学习愉快!

0

0 学习 · 15276 问题

查看课程