(1)已知页面放置h1标签元素、p元素和按钮button元素,默认值为韩梅梅同学的个人信息。(如图所示) (2)编写代码,实现单击“获取并修改信息”,修改该学生的详细信息为你个人的详细信息, (提示:更改元素的innerHTML属性值为个人学号班级等信息或者使用text()方法),原始页面及效果图如下图所示. (3)保存为“学号+姓名 试题2.html”
时间: 2024-04-05 19:30:52 浏览: 12
很抱歉,我无法展示图片或HTML代码,但我可以为您提供代码示例,您可以根据示例进行操作。
HTML代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>学生信息</title>
</head>
<body>
<h1>韩梅梅</h1>
<p>学号:123456</p>
<p>班级:计算机科学与技术1班</p>
<button id="modifyBtn">获取并修改信息</button>
<script src="modifyInfo.js"></script>
</body>
</html>
```
JavaScript代码:
```javascript
// 获取按钮元素
var modifyBtn = document.getElementById('modifyBtn');
// 绑定按钮点击事件
modifyBtn.addEventListener('click', function() {
// 获取p元素集合
var pList = document.getElementsByTagName('p');
// 修改第一个p元素的内容
pList[0].innerHTML = '学号:654321';
// 修改第二个p元素的内容
pList[1].innerHTML = '班级:计算机科学与技术2班';
});
```
将上述HTML代码和JavaScript代码保存为“学号+姓名 试题2.html”和“modifyInfo.js”两个文件,放在同一目录下即可。