取名网站源码程序
时间 : 2024-01-12 17:11:02声明： : 文章内容来自网络，不保证准确性，请自行甄别信息有效性
最佳答案
以下是一个简单的取名网站的源码程序示例，使用了HTML、CSS和JavaScript：
HTML代码（index.html）：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>取名网站</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>取名网站</h1>
<div id="result-container">
<h2>随机生成的名字：</h2>
<p id="result">
</div>
<button id="generate-btn">点击生成名字</button>
<script src="script.js"></script>
</body>
</html>
CSS代码（style.css）：
body {
font-family: Arial, sans-serif;
text-align: center;
}
h1 {
margin-top: 50px;
}
#result-container {
margin-top: 30px;
}
#generate-btn {
margin-top: 20px;
padding: 10px 20px;
font-size: 16px;
background-color: #4CAF50;
color: white;
border: none;
cursor: pointer;
}
#generate-btn:hover {
background-color: #45a049;
}
JavaScript代码（script.js）：
window.onload = function() {
var generateBtn = document.getElementById('generate-btn');
var resultContainer = document.getElementById('result');
var names = ['张三', '李四', '王五', '赵六', '刘七'];
generateBtn.addEventListener('click', function() {
var randomIndex = Math.floor(Math.random() * names.length);
var randomName = names[randomIndex];
resultContainer.textContent = randomName;
});
};
以上代码实现了一个简单的随机生成名字的网站。当用户点击"点击生成名字"按钮时，JavaScript代码会从预定义的名字数组中随机选择一个名字，并将其显示在页面上。
你可以根据自己的需求进行修改和扩展，例如添加更多的名字选项或美化界面样式。
其他答案
下面是一个简单的取名网站的源码程序示例：
HTML文件（index.html）：
取名网站 取名网站
CSS文件（style.css）：
h1 {
text-align: center;
color: #333;
}
#generator {
text-align: center;
margin-top: 50px;
font-size: 24px;
}JavaScript文件（script.js）：
```js
const firstNames = ["张", "李", "赵", "王", "刘"];
const lastNames = ["三", "四", "五", "六", "七"];
const generateName = () => {
const firstName = firstNames[Math.floor(Math.random() * firstNames.length)];
const lastName = lastNames[Math.floor(Math.random() * lastNames.length)];
return firstName + lastName;
};
const displayGeneratedName = () => {
const generatorDiv = document.getElementById("generator");
const name = generateName();
generatorDiv.innerHTML = name;
};
displayGeneratedName();
这个示例中，首先是一个基本的HTML文件，包含了一个标题和一个div元素用于显示生成的名字。接下来，CSS文件包含了一些简单的样式，包括居中对齐和字体大小。JavaScript文件定义了一个名字生成器的函数，其中包含了一些常见的姓氏和名字。然后定义了一个用于显示生成名字的函数，通过随机选择姓氏和名字的方式生成一个新的名字，最后在页面加载完毕后调用这个函数来显示生成的名字。
这只是一个基础的示例，你可以根据需要对其进行扩展和定制。
https/SSL证书广告优选IDC>>
推荐主题模板更多>>
推荐文章
