请老师帮忙检查一下代码
来源: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 {
width: 324px;
margin: 0 auto;
}
button {
padding: 10px 20px;
margin-bottom: 20px;
border: none;
border-radius: 3px;
background: #f01414;
color: #fff;
}
#intro {
width: 300px;
min-height: 100px;
line-height: 20px;
padding: 10px;
border: 2px solid gray;
border-radius: 3px;
}
</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
同学你好,代码实现效果可以。继续加油,祝学习愉快!
相似问题