\n\n\n\n \n \n
\u667a\u80fd\u968f\u673a\u6570\u751f\u6210\u5668<\/title>\n <style>\n :root {\n --primary-color: #2c3e50;\n --secondary-color: #3498db;\n --success-color: #27ae60;\n --error-color: #e74c3c;\n }\n\n body {\n font-family: 'Segoe UI', system-ui, sans-serif;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 100vh;\n margin: 0;\n background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);\n }\n\n .container {\n background: rgba(255, 255, 255, 0.95);\n padding: 2.5rem;\n border-radius: 1rem;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n width: 90%;\n max-width: 500px;\n backdrop-filter: blur(10px);\n }\n\n h1 {\n color: var(--primary-color);\n text-align: center;\n margin-bottom: 2rem;\n font-weight: 600;\n }\n\n .input-group {\n margin-bottom: 1.5rem;\n }\n\n label {\n display: block;\n margin-bottom: 0.5rem;\n color: var(--primary-color);\n font-weight: 500;\n }\n\n input {\n width: 100%;\n padding: 0.8rem;\n border: 2px solid #ddd;\n border-radius: 0.5rem;\n font-size: 1rem;\n transition: border-color 0.3s ease;\n }\n\n input:focus {\n outline: none;\n border-color: var(--secondary-color);\n box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.2);\n }\n\n button {\n width: 100%;\n padding: 1rem;\n background: var(--secondary-color);\n color: white;\n border: none;\n border-radius: 0.5rem;\n font-size: 1.1rem;\n font-weight: 600;\n cursor: pointer;\n transition: transform 0.2s, background 0.3s;\n }\n\n button:hover {\n background: #2980b9;\n transform: translateY(-2px);\n }\n\n button:active {\n transform: translateY(0);\n }\n\n #result {\n margin-top: 2rem;\n text-align: center;\n font-size: 1.8rem;\n font-weight: bold;\n color: var(--primary-color);\n min-height: 2.5rem;\n }\n\n .error {\n color: var(--error-color);\n text-align: center;\n margin-top: 1rem;\n font-weight: 500;\n display: none;\n }\n\n .history {\n margin-top: 2rem;\n padding: 1rem;\n background: #f8f9fa;\n border-radius: 0.5rem;\n max-height: 200px;\n overflow-y: auto;\n }\n\n .history h3 {\n margin: 0 0 1rem 0;\n color: var(--primary-color);\n }\n\n .history-item {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem;\n background: white;\n margin-bottom: 0.5rem;\n border-radius: 0.3rem;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <h1>\ud83c\udfb2 \u667a\u80fd\u968f\u673a\u6570\u751f\u6210\u5668<\/h1>\n \n <div class=\"input-group\">\n <label for=\"min\">\u6700\u5c0f\u503c\uff1a<\/label>\n <input type=\"number\" id=\"min\" placeholder=\"\u4f8b\u5982\uff1a-100\" autocomplete=\"off\">\n <\/div>\n\n <div class=\"input-group\">\n <label for=\"max\">\u6700\u5927\u503c\uff1a<\/label>\n <input type=\"number\" id=\"max\" placeholder=\"\u4f8b\u5982\uff1a500\" autocomplete=\"off\">\n <\/div>\n\n <button onclick=\"generateRandom()\">\u751f\u6210\u968f\u673a\u6570<\/button>\n\n <div id=\"result\"><\/div>\n <div id=\"error\" class=\"error\"><\/div>\n\n <div class=\"history\">\n <h3>\u751f\u6210\u5386\u53f2 (\u6700\u8fd110\u6761)<\/h3>\n <div id=\"historyList\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n let history = [];\n\n function generateRandom() {\n const minInput = document.getElementById('min');\n const maxInput = document.getElementById('max');\n const resultDiv = document.getElementById('result');\n const errorDiv = document.getElementById('error');\n \n const min = parseInt(minInput.value);\n const max = parseInt(maxInput.value);\n\n \/\/ \u91cd\u7f6e\u72b6\u6001\n errorDiv.style.display = 'none';\n resultDiv.textContent = '';\n minInput.style.borderColor = '#ddd';\n maxInput.style.borderColor = '#ddd';\n\n \/\/ \u9a8c\u8bc1\u903b\u8f91\n if (isNaN(min) || isNaN(max)) {\n showError('\u8bf7\u8f93\u5165\u6709\u6548\u7684\u6570\u5b57\u8303\u56f4');\n isNaN(min) ? minInput.style.borderColor = '#e74c3c' \n : maxInput.style.borderColor = '#e74c3c';\n return;\n }\n\n if (min >= max) {\n showError('\u6700\u5927\u503c\u5fc5\u987b\u5927\u4e8e\u6700\u5c0f\u503c');\n maxInput.style.borderColor = '#e74c3c';\n return;\n }\n\n \/\/ \u751f\u6210\u968f\u673a\u6570\uff08\u5305\u542b\u8fb9\u754c\uff09\n const random = Math.floor(Math.random() * (max - min + 1)) + min;\n \n \/\/ \u663e\u793a\u7ed3\u679c\n resultDiv.innerHTML = `\ud83c\udf89 \u968f\u673a\u6570\uff1a<span style=\"color: ${getRandomColor()}\">${random}<\/span>`;\n \n \/\/ \u8bb0\u5f55\u5386\u53f2\n addToHistory(random, min, max);\n }\n\n function showError(message) {\n const errorDiv = document.getElementById('error');\n errorDiv.textContent = message;\n errorDiv.style.display = 'block';\n }\n\n function getRandomColor() {\n const colors = ['#e74c3c', '#3498db', '#2ecc71', '#9b59b6', '#f1c40f'];\n return colors[Math.floor(Math.random() * colors.length)];\n }\n\n function addToHistory(number, min, max) {\n history.unshift({\n number,\n range: `[${min}, ${max}]`,\n timestamp: new Date().toLocaleTimeString()\n });\n \n \/\/ \u4fdd\u6301\u6700\u591a10\u6761\u8bb0\u5f55\n if (history.length > 10) history.pop();\n\n \/\/ \u66f4\u65b0\u5386\u53f2\u663e\u793a\n const historyList = document.getElementById('historyList');\n historyList.innerHTML = history.map(item => `\n <div class=\"history-item\">\n <span>${item.number}<\/span>\n <span style=\"color: #7f8c8d\">${item.range}<\/span>\n <span style=\"color: #95a5a6\">${item.timestamp}<\/span>\n <\/div>\n `).join('');\n }\n <\/script>\n<\/body>\n<\/html>\n<\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">HTML\u4ee3\u7801\u5982\u4e0b\uff0c\u53ef\u5728\u672c\u5730\u90e8\u7f72\uff08windows\uff09\uff0c\u5148\u4f7f\u7528\u8bb0\u4e8b\u672c\u6253\u5f00\uff0c\u7136\u540e\u5c06\u540e\u7f00\u540d\u6539\u4e3aHTML\u683c\u5f0f\u5373\u53ef<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>\u667a\u80fd\u968f\u673a\u6570\u751f\u6210\u5668<\/title>\n <style>\n :root {\n --primary-color: #2c3e50;\n --secondary-color: #3498db;\n --success-color: #27ae60;\n --error-color: #e74c3c;\n }\n\n body {\n font-family: 'Segoe UI', system-ui, sans-serif;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 100vh;\n margin: 0;\n background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);\n }\n\n .container {\n background: rgba(255, 255, 255, 0.95);\n padding: 2.5rem;\n border-radius: 1rem;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n width: 90%;\n max-width: 500px;\n backdrop-filter: blur(10px);\n }\n\n h1 {\n color: var(--primary-color);\n text-align: center;\n margin-bottom: 2rem;\n font-weight: 600;\n }\n\n .input-group {\n margin-bottom: 1.5rem;\n }\n\n label {\n display: block;\n margin-bottom: 0.5rem;\n color: var(--primary-color);\n font-weight: 500;\n }\n\n input {\n width: 100%;\n padding: 0.8rem;\n border: 2px solid #ddd;\n border-radius: 0.5rem;\n font-size: 1rem;\n transition: border-color 0.3s ease;\n }\n\n input:focus {\n outline: none;\n border-color: var(--secondary-color);\n box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.2);\n }\n\n button {\n width: 100%;\n padding: 1rem;\n background: var(--secondary-color);\n color: white;\n border: none;\n border-radius: 0.5rem;\n font-size: 1.1rem;\n font-weight: 600;\n cursor: pointer;\n transition: transform 0.2s, background 0.3s;\n }\n\n button:hover {\n background: #2980b9;\n transform: translateY(-2px);\n }\n\n button:active {\n transform: translateY(0);\n }\n\n #result {\n margin-top: 2rem;\n text-align: center;\n font-size: 1.8rem;\n font-weight: bold;\n color: var(--primary-color);\n min-height: 2.5rem;\n }\n\n .error {\n color: var(--error-color);\n text-align: center;\n margin-top: 1rem;\n font-weight: 500;\n display: none;\n }\n\n .history {\n margin-top: 2rem;\n padding: 1rem;\n background: #f8f9fa;\n border-radius: 0.5rem;\n max-height: 200px;\n overflow-y: auto;\n }\n\n .history h3 {\n margin: 0 0 1rem 0;\n color: var(--primary-color);\n }\n\n .history-item {\n display: flex;\n justify-content: space-between;\n padding: 0.5rem;\n background: white;\n margin-bottom: 0.5rem;\n border-radius: 0.3rem;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <h1>\ud83c\udfb2 \u667a\u80fd\u968f\u673a\u6570\u751f\u6210\u5668<\/h1>\n \n <div class=\"input-group\">\n <label for=\"min\">\u6700\u5c0f\u503c\uff1a<\/label>\n <input type=\"number\" id=\"min\" placeholder=\"\u4f8b\u5982\uff1a-100\" autocomplete=\"off\">\n <\/div>\n\n <div class=\"input-group\">\n <label for=\"max\">\u6700\u5927\u503c\uff1a<\/label>\n <input type=\"number\" id=\"max\" placeholder=\"\u4f8b\u5982\uff1a500\" autocomplete=\"off\">\n <\/div>\n\n <button onclick=\"generateRandom()\">\u751f\u6210\u968f\u673a\u6570<\/button>\n\n <div id=\"result\"><\/div>\n <div id=\"error\" class=\"error\"><\/div>\n\n <div class=\"history\">\n <h3>\u751f\u6210\u5386\u53f2 (\u6700\u8fd110\u6761)<\/h3>\n <div id=\"historyList\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n let history = [];\n\n function generateRandom() {\n const minInput = document.getElementById('min');\n const maxInput = document.getElementById('max');\n const resultDiv = document.getElementById('result');\n const errorDiv = document.getElementById('error');\n \n const min = parseInt(minInput.value);\n const max = parseInt(maxInput.value);\n\n \/\/ \u91cd\u7f6e\u72b6\u6001\n errorDiv.style.display = 'none';\n resultDiv.textContent = '';\n minInput.style.borderColor = '#ddd';\n maxInput.style.borderColor = '#ddd';\n\n \/\/ \u9a8c\u8bc1\u903b\u8f91\n if (isNaN(min) || isNaN(max)) {\n showError('\u8bf7\u8f93\u5165\u6709\u6548\u7684\u6570\u5b57\u8303\u56f4');\n isNaN(min) ? minInput.style.borderColor = '#e74c3c' \n : maxInput.style.borderColor = '#e74c3c';\n return;\n }\n\n if (min >= max) {\n showError('\u6700\u5927\u503c\u5fc5\u987b\u5927\u4e8e\u6700\u5c0f\u503c');\n maxInput.style.borderColor = '#e74c3c';\n return;\n }\n\n \/\/ \u751f\u6210\u968f\u673a\u6570\uff08\u5305\u542b\u8fb9\u754c\uff09\n const random = Math.floor(Math.random() * (max - min + 1)) + min;\n \n \/\/ \u663e\u793a\u7ed3\u679c\n resultDiv.innerHTML = `\ud83c\udf89 \u968f\u673a\u6570\uff1a<span style=\"color: ${getRandomColor()}\">${random}<\/span>`;\n \n \/\/ \u8bb0\u5f55\u5386\u53f2\n addToHistory(random, min, max);\n }\n\n function showError(message) {\n const errorDiv = document.getElementById('error');\n errorDiv.textContent = message;\n errorDiv.style.display = 'block';\n }\n\n function getRandomColor() {\n const colors = ['#e74c3c', '#3498db', '#2ecc71', '#9b59b6', '#f1c40f'];\n return colors[Math.floor(Math.random() * colors.length)];\n }\n\n function addToHistory(number, min, max) {\n history.unshift({\n number,\n range: `[${min}, ${max}]`,\n timestamp: new Date().toLocaleTimeString()\n });\n \n \/\/ \u4fdd\u6301\u6700\u591a10\u6761\u8bb0\u5f55\n if (history.length > 10) history.pop();\n\n \/\/ \u66f4\u65b0\u5386\u53f2\u663e\u793a\n const historyList = document.getElementById('historyList');\n historyList.innerHTML = history.map(item => `\n <div class=\"history-item\">\n <span>${item.number}<\/span>\n <span style=\"color: #7f8c8d\">${item.range}<\/span>\n <span style=\"color: #95a5a6\">${item.timestamp}<\/span>\n <\/div>\n `).join('');\n }\n <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u968f\u673a\u6570\u751f\u6210\u5668\uff08\u53ef\u9009\u62e9\u751f\u6210\u8303\u56f4\uff09-Deepseek Deepseek:www.Deepseek.com \u89c6\u9891\u5730\u5740 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-506","post","type-post","status-publish","format-standard","hentry","category-1"],"_links":{"self":[{"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=\/wp\/v2\/posts\/506","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=506"}],"version-history":[{"count":0,"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=\/wp\/v2\/posts\/506\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=506"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=506"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.shuaigehuang.top\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=506"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}