用js创建一个页面,页面上有一个文本框、一个按钮和一个div,按钮显示“请在文本框中输入你的姓名”,而文本框的value值默认为自己的姓名。要求实现效果为:当单击该按钮后,页面会弹出对话框显示“你好,xx!”(xx是文本框的value属性值),并在div中显示显示“这里是xx的页面”(xx是文本框的value属性值)。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<input type="text" id="name">
<button id="btn">请在文本框中输入你的姓名</button>
<div id="msg"></div>
</body>
</html>
<script type="text/javascript">
document.getElementById("name").value = '默认姓名';
document.getElementById("btn").onclick = () => {
const name = document.getElementById("name").value;
document.getElementById('msg').innerText = '这里是' + name + '的页面';
alert('你好,' + name + '!');
}
</script>