From 80aac95e5a024ce396c8cc6df84e071f1b67816c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=BD=AF=E4=BB=B6=E5=AD=A6=E4=B9=A0?= <1252043785@qq.com>
Date: Wed, 9 Oct 2024 12:58:11 +0800
Subject: [PATCH] jzqzh
---
index.html | 41 +++++++++++++++++++++++++++++++++
script.js | 34 ++++++++++++++++++++++++++++
styles.css | 66 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 141 insertions(+)
create mode 100644 index.html
create mode 100644 script.js
create mode 100644 styles.css
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..5951193
--- /dev/null
+++ b/index.html
@@ -0,0 +1,41 @@
+
+
+
+
+
+
+ 进制转换器
+
+
+
+
+
+
进制转换器
+
+
+
+
+
+
+
+
+
+
+
结果:
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..96fccd5
--- /dev/null
+++ b/script.js
@@ -0,0 +1,34 @@
+document.getElementById('convert').addEventListener('click', function () {
+ const input = document.getElementById('input').value;
+ const fromBase = parseInt(document.getElementById('from-base').value);
+ const toBase = parseInt(document.getElementById('to-base').value);
+
+ // 将输入转换为十进制
+ let decimal;
+ try {
+ decimal = parseInt(input, fromBase);
+ if (isNaN(decimal)) throw new Error("无效输入");
+ } catch (error) {
+ document.getElementById('result').innerText = "输入无效,请检查!";
+ return;
+ }
+
+ // 将十进制转换为目标进制
+ let result;
+ switch (toBase) {
+ case 2:
+ result = decimal.toString(2);
+ break;
+ case 8:
+ result = decimal.toString(8);
+ break;
+ case 10:
+ result = decimal.toString(10);
+ break;
+ case 16:
+ result = decimal.toString(16).toUpperCase();
+ break;
+ }
+
+ document.getElementById('result').innerText = result;
+});
\ No newline at end of file
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..1435a26
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,66 @@
+body {
+ font-family: Arial, sans-serif;
+ background-color: #eef2f3;
+ margin: 0;
+ padding: 20px;
+}
+
+.container {
+ max-width: 400px;
+ margin: auto;
+ background: white;
+ padding: 20px;
+ border-radius: 10px;
+ box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
+}
+
+h1 {
+ text-align: center;
+ color: #333;
+}
+
+h2 {
+ margin-top: 20px;
+ color: #555;
+}
+
+input,
+select,
+button {
+ width: 100%;
+ padding: 12px;
+ margin: 10px 0;
+ border: 1px solid #ccc;
+ border-radius: 5px;
+ font-size: 16px;
+}
+
+input:focus,
+select:focus,
+button:focus {
+ outline: none;
+ border-color: #007bff;
+}
+
+button {
+ background-color: #007bff;
+ color: white;
+ border: none;
+ cursor: pointer;
+ font-weight: bold;
+ transition: background-color 0.3s;
+}
+
+button:hover {
+ background-color: #0056b3;
+}
+
+#result {
+ padding: 10px;
+ background-color: #f8f9fa;
+ border: 1px solid #ddd;
+ border-radius: 5px;
+ text-align: center;
+ font-size: 18px;
+ color: #333;
+}
\ No newline at end of file