Home >Web Front-end >Front-end Q&A >javascript Fahrenheit Celsius temperature conversion

javascript Fahrenheit Celsius temperature conversion

WBOYOriginal: 2023-05-20 22:59:06815browse

JavaScript is a client-side scripting language that can be executed on the browser. In web development, JavaScript is widely used, including the function of converting between Fahrenheit and Celsius. In this article, we'll show you how to write a Fahrenheit to Celsius converter using JavaScript.

Fahrenheit and Celsius are two different units of temperature measurement. Celsius is the international standard unit of temperature, while Fahrenheit is a widely used unit of temperature measurement in countries such as the United States, United Kingdom, and Canada. When doing temperature calculations, we often need to convert Celsius to Fahrenheit or Fahrenheit to Celsius.

In this article, we will provide a simple JavaScript function that can convert Celsius to Fahrenheit or Fahrenheit to Celsius. Let's start writing this function.

First, we need to encapsulate the JavaScript function in an HTML file. At the head of the file, we need to add the following code to ensure that the file can be correctly parsed as an HTML file:

<!DOCTYPE html>
<html>
<head>
    <title>JavaScript 华氏摄氏度转换器</title>
</head>

Next, we need to write the JavaScript function as a function. In this article, we will write two functions, one to convert Celsius to Fahrenheit and another to convert Fahrenheit to Celsius.

The first function is to convert Celsius to Fahrenheit. We can convert Celsius to Fahrenheit using the following formula:

°F = (°C * 9/5) 32

The function code is as follows:

function celsiusToFahrenheit(celsius) {
  var fahrenheit = (celsius * 9/5) + 32;
  return fahrenheit;
}

in the above In the function, we pass Celsius to the function, then convert it to Fahrenheit using a formula and store the result in the variable fahrenheit, and finally return fahrenheit through the return statement.

The second function is to convert Fahrenheit to Celsius. We can convert Fahrenheit to Celsius using the following formula:

°C = (°F - 32) * 5/9

The function code is as follows:

function fahrenheitToCelsius(fahrenheit) {
  var celsius = (fahrenheit - 32) * 5/9;
  return celsius;
}

above In the function, we pass Fahrenheit to the function, then use a formula to convert it to Celsius and store the result in the variable celsius, and finally return celsius through the return statement.

Now we have written two functions that convert Celsius to Fahrenheit or Fahrenheit to Celsius. Below is a complete HTML file containing functions to convert Celsius to Fahrenheit or Fahrenheit to Celsius. Users can enter a number in the input box and click the corresponding button to convert it to another temperature unit.

<!DOCTYPE html>
<html>
<head>
    <title>JavaScript 华氏摄氏度转换器</title>
    <script>
        function celsiusToFahrenheit(celsius) {
          var fahrenheit = (celsius * 9/5) + 32;
          return fahrenheit;
        }

        function fahrenheitToCelsius(fahrenheit) {
          var celsius = (fahrenheit - 32) * 5/9;
          return celsius;
        }

        function convertCelsius() {
            var celsius = parseFloat(document.getElementById("celsiusInput").value);
            var fahrenheit = celsiusToFahrenheit(celsius);
            document.getElementById("result").innerHTML = fahrenheit + "°F";
        }

        function convertFahrenheit() {
            var fahrenheit = parseFloat(document.getElementById("fahrenheitInput").value);
            var celsius = fahrenheitToCelsius(fahrenheit);
            document.getElementById("result").innerHTML = celsius + "°C";
        }
    </script>
</head>
<body>
    <h1>JavaScript 华氏摄氏度转换器</h1>
    <p>输入摄氏度 <input type="number" id="celsiusInput"> <button onclick="convertCelsius()">转换为华氏度</button></p>
    <p>输入华氏度 <input type="number" id="fahrenheitInput"> <button onclick="convertFahrenheit()">转换为摄氏度</button></p>
    <div id="result"></div>
</body>
</html>

In the above HTML file, we first introduced two JavaScript functions celsiusToFahrenheit and fahrenheitToCelsius. We then created two buttons, one to convert Celsius to Fahrenheit and another to convert Fahrenheit to Celsius. When the user clicks the corresponding button, the JavaScript code will get the number from the input box and call the corresponding function to convert it to another temperature unit based on the button selected by the user. The final results will be displayed on the page.

Conclusion

In this article, we showed you how to write a Fahrenheit to Celsius converter using JavaScript. We wrote two JavaScript functions, one to convert Celsius to Fahrenheit and another to convert Fahrenheit to Celsius. We also created an HTML file that contains two input boxes and two buttons where the user can enter a number and convert it to another temperature unit. This converter can help users perform temperature conversion quickly and accurately, improving the user experience.

The above is the detailed content of javascript Fahrenheit Celsius temperature conversion. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Can you find a job by teaching yourself JavaScript?Next article：Can you find a job by teaching yourself JavaScript?

See more

javascript Fahrenheit Celsius temperature conversion

Related articles