前言

想将ai写的密码自动生成器的网页整合到网站上

步骤

通过ai自动生成名为generate_password.html文件的代码，将js同时写入至html中，不分开js，形成单个网页。生成代码如下：

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>密码生成器</title>
<style>
  body {
    font-family: 'Arial', sans-serif;
    background-color: #f4f4f9;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
  }
  .container {
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    width: 300px;
    text-align: center;
  }
  h1 {
    margin-bottom: 20px;
    color: #333;
  }
  label {
    display: block;
    margin-bottom: 10px;
    text-align: left;
  }
  input[type="number"] {
    width: 90%;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 4px;
  }
  input[type="checkbox"] {
    margin-right: 5px;
  }
  button {
    width: 100%;
    padding: 10px;
    background-color: #007BFF;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
  }
  button:hover {
    background-color: #0056b3;
  }
  .output {
    margin-top: 20px;
    padding: 10px;
    background: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 4px;
    min-height: 40px;
    word-break: break-all;
  }
</style>
</head>
<body>
<div class="container">
  <h1>密码生成器</h1>
  <label for="length">密码长度 (8-20):</label>
  <input type="number" id="length" value="12"><br>

  <label><input type="checkbox" id="uppercase" checked> 包含大写字母</label><br>
  <label><input type="checkbox" id="lowercase" checked> 包含小写字母</label><br>
  <label><input type="checkbox" id="numbers" checked> 包含数字</label><br>
  <label><input type="checkbox" id="symbols"> 包含特殊字符 (!@#$%^&*)</label><br>

  <button onclick="generatePassword()">生成密码</button>

  <div class="output" id="password"></div>
</div>

<script>
function generatePassword() {
  const length = document.getElementById('length').value;
  let charSet = '';
  if (document.getElementById('uppercase').checked) charSet += 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
  if (document.getElementById('lowercase').checked) charSet += 'abcdefghijklmnopqrstuvwxyz';
  if (document.getElementById('numbers').checked) charSet += '0123456789';
  if (document.getElementById('symbols').checked) charSet += '!@#$%^&*';

  if (charSet === '') {
    alert('请至少选择一种字符类型');
    return;
  }

  let password = '';
  for (let i = 0; i < length; i++) {
    const randomIndex = Math.floor(Math.random() * charSet.length);
    password += charSet[randomIndex];
  }

  document.getElementById('password').innerText = password;
}
</script>
</body>
</html>