美文网首页
2021-11-28

2021-11-28

作者: 宋五 | 来源:发表于2021-11-28 17:21 被阅读0次

    1.html结合JavaScript写一个网站的登录页面;
    2.登录页面中包含图片,密码表单使用password进行加密处理;
    3.登录之后返回登录信息,例如:"xxx欢迎登录",内容使用弹窗弹出;
    4.js文件和html文件分开,也就是使用引入外部文件的方式加载js;

    index.html

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>网站登录页面</title>
    </head>
    
    <body>
        <h1>你好,欢迎来到我的网站</h1>
        <img src="https://app.ninchanese.com/image/word/simplified/6212/%E4%BD%A0%E5%A5%BD.jpg">
        <p></p>
        
        用户 <input type="text" id="username" name="username" />
        <p></p>
        
        密码 <input type="password" id="password" />
        
        <!-- 引入外部js-->
        <script src="info.js"></script>
        <button onclick="handle()">登录</button>
    
    </body>
    
    </html>
    

    info.js

    function handle(){
        var username = document.getElementById('username').value ;
        var info = ""+username+" 登录成功"
        alert(info)
    }
    

    相关文章

      网友评论

          本文标题:2021-11-28

          本文链接:https://www.haomeiwen.com/subject/btqhxrtx.html