使用JavaScript编写的一个简易随机密码生成网页

自渡

2024-10-22 / 0 评论 / 24 阅读

10/22

前言

最近网站数据泄露事件频发，虽然大多数网站对用户密码都会进行脱敏处理，但我们在日常使用中，最好还是不要多个网站使用同一个密码，最安全的办法就是建立一个密码管理器，并且每个网站使用不同的随机密码，以防止黑客通过撞库攻击登录你的账号。
下面是通过javascript编写的一个随机密码生成html页面，可用于生成随机密码：

说明

HTML 结构：
- 只读文本框用于显示生成的随机密码。
- 点击一次按钮可生成一个随机密码。
JavaScript 函数：
- 通过 generatePassword 函数生成一个指定长度的随机密码。
- 密码由大写字母、小写字母、数字和特殊字符组成。
样式：
- 简单的 CSS 样式使界面更美观。

使用方法

将上述代码复制到一个 .html 文件中。
在浏览器中打开该文件。
点击“生成随机密码”按钮，即可在输入框中看到生成的密码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>随机密码生成页</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        input {
            width: 200px;
            padding: 10px;
            margin-right: 10px;
        }
        button {
            padding: 10px 15px;
        }
    </style>
</head>
<body>
    <h2>随机密码生成页面</h2>
    <input type="text" id="password" readonly>
    <button onclick="generatePassword()">生成随机密码</button>

    <script>
        function generatePassword(length = 12) {
            const charset = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+";
            let password = "";
            for (let i = 0; i < length; i++) {
                const randomIndex = Math.floor(Math.random() * charset.length);
                password += charset[randomIndex];
            }
            document.getElementById("password").value = password;
        }
    </script>
</body>
</html>

使用JavaScript编写的一个简易随机密码生成网页

前言

说明

使用方法

评论 (0)