<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> .box{ width: 700px; height: 4

动态未结 0 86

小小草 LV1 2023年9月23日 23:40 发表

该网页实现了一个简单的学生信息添加功能。用户可以输入学生的姓名、年龄和性别，点击“添加学生信息”按钮后，页面会显示出已经添加的学生信息。该网页使用了HTML、CSS和JavaScript三种技术。其中，HTML用于搭建页面结构，CSS用于美化页面样式，JavaScript用于实现交互功能。在JavaScript代码中，定义了一个名为“aa”的函数，该函数用于获取用户输入的学生信息，并将其添加到页面上。具体实现过程如下： 1. 使用document.getElementById()方法获取用户输入的姓名、年龄和性别。 2. 判断用户输入的内容是否为空，如果为空则弹出提示框并返回。 3. 使用document.createElement()方法创建一个新的

元素，并将其内容设置为用户输入的学生信息。 4. 使用appendChild()方法将新创建的

元素添加到页面上。 5. 清空用户输入框中的内容，以便下一次输入。需要注意的是，在HTML代码中，性别的输入框应该使用同一个name属性，这样才能保证用户只能选择一个选项。