html+js实现简单的登陆页面

Elaine+1

于 2018-11-29 17:41:52 发布

阅读量1w

点赞数 5

分类专栏： webui 文章标签： html js 登录页面

本文链接：https://blog.csdn.net/weixin_38655333/article/details/84636997

版权

本文介绍了初学者如何利用HTML和JavaScript创建一个简单的登录页面。页面包含重置功能，可清除输入信息，并通过JavaScript获取并展示用户名和密码。

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

初学web自动化，学习简单的前端知识还是很有必要的；

今天我们利用html实现一个简单的登陆页面，并利用js提取用户名和密码，在alert弹窗中显示出来

实现的功能：

1.实现重置按钮的功能，点击重置按钮，能清除你填写的数据

2.填写用户名，密码，点击登录，获取到用户名和密码通过alert提示框展示出来。

效果图
初始页面运行效果

代码如下：

<!DOCTYPE html>
<html>
  <head>
    <title>登陆.html</title>
  </head>
  <body>
    <form name="user" action="#" method="get">
       <table  align="center">
          <tr>
             <td>用户名</td>
             <td>
                <input type="text" name="username" id="username"/>
            </td>
          &