首页js通过编辑框输入圆的半径，计算面积和周长在网页是显示出来。

js通过编辑框输入圆的半径，计算面积和周长在网页是显示出来。

时间: 2024-09-18 21:05:31 浏览: 54

在JavaScript中，你可以创建一个简单的HTML页面来获取用户输入的圆的半径，然后利用公式计算面积和周长，并将结果显示出来。下面是一个基本的示例： ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>圆的面积和周长计算器</title> </head> <body> <label for="radius">请输入圆的半径:</label> <input type="number" id="radius" name="radius"> <button onclick="calculateAreaAndCircumference()">计算</button> <div id="results"> <p id="area">面积: <span></span></p> <p id="circumference">周长: <span></span></p> </div> <script> function calculateAreaAndCircumference() { const radiusInput = document.getElementById("radius"); const radius = parseFloat(radiusInput.value); // 如果半径为空或者不是数字，则提示错误信息 if (!radius || isNaN(radius)) { alert("请输入有效的半径值。"); return; } const area = Math.PI * radius ** 2; const circumference = 2 * Math.PI * radius; document.getElementById("area span").innerText = area.toFixed(2); document.getElementById("circumference span").innerText = circumference.toFixed(2); } </script> </body> </html> ``` 在这个示例中，用户输入圆的半径后，点击“计算”按钮会触发`calculateAreaAndCircumference`函数，它首先验证输入是否有效，然后根据公式计算面积和周长，并将结果显示在页面上。

阅读全文