HTML、CSS 和 JavaScript 构建问答网页 - 简单教程
<!DOCTYPE html>
<html>
<head>
<style>
body { font-family: Arial, sans-serif; margin: 0; padding: 20px; }
h1 { color: #333; }
#output { border: 1px solid #ccc; padding: 10px; margin-bottom: 20px; }
#input { width: 100%; padding: 10px; font-size: 16px; }
#send-btn { background-color: #4CAF50; color: white; padding: 10px 20px; border: none; cursor: pointer; font-size: 16px; }
#send-btn:hover { background-color: #45a049; }
</style>
</head>
<body>
<h1>问答网页</h1>
<div id="output"></div>
<input type="text" id="input" placeholder="请输入问题">
<button id="send-btn">发送</button>
<script>
const outputDiv = document.getElementById('output');
const inputField = document.getElementById('input');
const sendButton = document.getElementById('send-btn');
sendButton.addEventListener('click', function() { const question = inputField.value; outputDiv.innerHTML += "<p>问题：" + question + "</p>"; inputField.value = ''; });
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/puLs 著作权归作者所有。请勿转载和采集!