JavaScript入门写一个表单校验功能

那么今天咱们就来认识一下

JavaScript

什么是JavaScript?

JavaScript 是一种脚本语言(脚本语言是一种轻量级的编程语言) 被用来向页面添加交互行为的~通常直接嵌入到HTML页面中,JavaScript是一种解释性语言。

Java和JavaScript的关系?

Java 和 JavaScript 名字这么像，相信有很多小伙伴都会有一点想法~Java和JavaScript是不是有什么关系~在这里给大家解释一下~Java和JavaScript的关系就像老婆和老婆饼的关系是一样的~

JavaScript的作用?

HTML是网站的骨架，CSS是用来给骨架进行美化的，JavaScript让整个页面具有动态的效果。所以这下你知道他们为什么又叫“前端三剑客”了吗？

JavaScript的语法规则

其实JavaScript的语法和Java很像，学完JavaSE之后再来学习JavaScript就会发现其实很简单的~

1)所有的变量使用var来定义、是弱类型变量，不代表没有类型、变量本身是有类型的。

2）每行结尾的分号可有可无，建议写上。

3）注释和Java相似，支持单行注释（//）多行注释（/* */）

在JavaScript中有5中原始数据类型有number、string、boolean、null和undefined，引用数据类型都是object对象~我们可以利用typeof()方法来查看数据类型

接下来咱们先来看看变量：

null和undefined的区别

null：对象不存在

undefined：对象存在，访问的属性或者方法不存在

想信很多对于基础的部分不是那么感兴趣那么咱们直接上干货吧~

利用js完成表单校验

首先来看一下js是如何获取元素的

document.getElementById("id名称");

利用js是获取元素的值

document.getElementById("name").value;

想要完成表单验证功能除了获取，我们还需要输出功能

警告框：alert();

上面的弹窗就是了，咱们就不演示了

向页面指定位置写入内容 innerHTML

向页面写入内容 document.write(" ");

下面咱们就可以动手做了我们的表单校验功能了

首先给咱们需要校验的元素设置id，然后给表单添加一个函数~（这个页面就是之前咱们编写的注册页面）

然后完善函数的逻辑

这样我们的表单验证就完成了

效果咱们就不演示了

源码都在截图上~

小伙伴们自己试试

我是萌新娜娜

立志做一个不翻车的老司机

学习Java的路上请多多指教

扩展阅读

前端面试之JavaScript（总结）

如何用JavaScript手动实现一个栈

JavaScript 开发人员需要知道的简写技巧

公众号：javafirst