工具类网页

工具类网页

这是一个工具类网页,提供以下工具:

  • 计算器
  • 单位转换
  • 随机数生成器
  • 密码生成器
<h2>计算器</h2>
<p>请输入两个数字:</p>
<input type="number" id="num1" placeholder="请输入数字">
<input type="number" id="num2" placeholder="请输入数字">
<button onclick="add()">加</button>
<button onclick="subtract()">减</button>
<button onclick="multiply()">乘</button>
<button onclick="divide()">除</button>
<p>计算结果为:<span id="result"></span></p>

<h2>单位转换</h2>
<p>请选择需要转换的单位:</p>
<select id="unit">
	<option value="米">米</option>
	<option value="千米">千米</option>
	<option value="英里">英里</option>
	<option value="海里">海里</option>
</select>
<p>请输入需要转换的数值:</p>
<input type="number" id="num" placeholder="请输入数值">
<button onclick="convert()">转换</button>
<p>转换结果为:<span id="converted"></span></p>

<h2>随机数生成器</h2>
<p>请输入生成随机数的范围:</p>
<input type="number" id="min" placeholder="最小值">
<input type="number" id="max" placeholder="最大值">
<button onclick="generate()">生成</button>
<p>生成的随机数为:<span id="random"></span></p>

<h2>密码生成器</h2>
<p>请输入密码长度:</p>
<input type="number" id="length" placeholder="请输入密码长度">
<button onclick="generatePassword()">生成密码</button>
<p>生成的密码为:<span id="password"></span></p>

<script>
	function add() {
		let num1 = document.getElementById("num1").value;
		let num2 = document.getElementById("num2").value;
		let result = parseInt(num1) + parseInt(num2);
		document.getElementById("result").innerHTML = result;
	}

	function subtract() {
		let num1 = document.getElementById("num1").value;
		let num2 = document.getElementById("num2").value;
		let result = parseInt(num1) - parseInt(num2);
		document.getElementById("result").innerHTML = result;
	}

	function multiply() {
		let num1 = document.getElementById("num1").value;
		let num2 = document.getElementById("num2").value;
		let result = parseInt(num1) * parseInt(num2);
		document.getElementById("result").innerHTML = result;
	}

	function divide() {
		let num1 = document.getElementById("num1").value;
		let num2 = document.getElementById("num2").value;
		let result = parseInt(num1) / parseInt(num2);
		document.getElementById("result").innerHTML = result;
	}

	function convert() {
		let num = document.getElementById("num").value;
		let unit = document.getElementById("unit").value;
		if (unit == "米") {
			let converted = num * 0.001;
			document.getElementById("converted").innerHTML = converted + "千米";
		} else if (unit == "千米") {
			let converted = num * 1000;
			document.getElementById("converted").innerHTML = converted + "米";
		} else if (unit == "英里") {
			let converted = num * 1.60934;
			document.getElementById("converted").innerHTML = converted + "千米";
		} else if (unit == "海里") {
			let converted = num * 1.852;
			document.getElementById("converted").innerHTML = converted + "千米";
		}
	}

	function generate() {
		let min = document.getElementById("min").value;
		let max = document.getElementById("max").value;
		let random = Math.floor(Math.random() * (max - min + 1)) + min;
		document.getElementById("random").innerHTML = random;
	}

	function generatePassword() {
		let length = document.getElementById("length").value;
		let password = "";
		let characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+";
		for (let i = 0; i < length; i++) {
			password += characters.charAt(Math.floor(Math.random() * characters.length));
		}
		document.getElementById("password").innerHTML = password;
	}
</script>

原文地址: https://www.cveoy.top/t/topic/cRvs 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录