JavaScript 表单操作以及验证

思诚代码块

已于 2022-02-16 15:37:39 修改

阅读量623

点赞数

分类专栏： JavaScript实战笔记+理论文章标签： javascript 前端开发语言

于 2022-02-16 15:26:37 首次发布

本文链接：https://blog.csdn.net/weixin_47556601/article/details/122959611

版权

本文介绍了如何使用JavaScript操作和验证HTML表单。通过示例展示了获取输入值、处理单选与多选框的方法，并提供了相关代码示例，帮助理解表单验证的基本逻辑。

摘要由CSDN通过智能技术生成

大家好，我们今天分享一下JavaScript 操作验证表单

首先我们要知道

用JavaScript操作表单和操作DOM是类似的，因为表单本身也是DOM树。

HTML表单的输入控件（标签）主要有以下几种：

文本框，对应的<input type="text">，用于输入文本；

口令框，对应的<input type="password">，用于输入口令；

单选框，对应的<input type="radio">，用于选择一项；

复选框，对应的<input type="checkbox">，用于选择多项；

下拉框，对应的<select>，用于选择一项；

隐藏文本，对应的<input type="hidden">，用户不可见，但表单提交时会把隐藏文本发送到服务器。

表单的目的：

提交用户的信息

因此，我们首先要获得用户信息

写一个简单的表单：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>
<from actiom="post">
    <span>用户名:</span><input type="text">
</from>
</body