老师帮忙检查一下
来源:4-5 编程练习
DB1时间的玫瑰
2021-08-26 11:02:29
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>对象展开运算符的应用</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>添加</button>
<div id="intro"></div>
</div>
<script>
// 在此补全代码
let wrap = document.getElementById('wrap');
// 获取按钮
const btn = document.querySelector('button');
// 获取div
let ointro = document.getElementById('intro');
// 创建函数
const userParam = {
name: "gf",
year: "2004",
director: "zxc",
star: "zxc / hsy",
type: "武打 / 爱情 ",
introduction: " aaaaaaa"
};
const logUser = userParam => {
const defaultParam = {
// 默认值
name: "dhxyzygbh ",
year: "2014",
director: "lzw",
star: "zxc / wmd /ljy",
type: "喜剧 / 爱情 / 奇幻 / 古装",
introduction: " asdadasdasdsad"
}
// 将默认参数和用户参数拼接作为最终参数
const {
name,
year,
director,
star,
type,
introduction
} = {...defaultParam,
...userParam
};
};
// 绑定事件
btn.onclick = function {
// 添加合并内容
ointro.innerHTML = `<h3>名称:${name}</h3></br>导演:${director}</br>主演:${star}</br>类型:${type}</br>上映年份:${year}</br>简介:${introduction}`
};
logUser();
</script>
</body>
</html>
1回答
同学你好,给按钮绑定的点击事件中,function后面没有添加括号,不符合语法,建议添加上,示例:
另外,应该在logUser函数中,设置ointro的innerHTML属性值,然后在点击事件函数中调用logUser函数并传入参数就可以了。为了方便截图,老师将代码折叠起来了,示例:
祝学习愉快~
相似问题