Fahrenheit To Celsius


#1

I am trying to make a calculator that converts fahreinheit to celsius but it is not working. Here is my code. Thanks for helping


#2

This,

onclick='fToC(userInputFToC)'

may be reduced to,

onclick='fToC()'

with no argument. The form control is already a cached element node so get the data from that.

var temp = userinputFToC.value;

Be sure that line is inside your function.

Quite simply,

var fToC = function() {
  var outputFToC = userInputFToC.value - 32 * 5 / 9;
};

Be sure to close the function body with a right curly brace and semi-colon. Note that the above will not give a correct answer since the subtraction needs to happen first, and above it happens last. You are subtracting 32 * 5 / 9.


In my script I like to have all the element nodes cached at the top of the script, and use simple variable names if the scirpt is simple.

const input = document.querySelector('input');
const output = document.querySelector('#output');
const button = document.querySelector('button');

For good measure I added the button so we can remove the onclick attribute from the HTML.

const fToC = () => {
  output.textContent = (input.value - 32) * 5 / 9;
};

At the bottom of the script, add a listener to your button…

button.onclick = fToC;

The above script suggestion allows for simpler HTML…

<html>
  <head>
    <meta charset="UTF-8">
    <title>Temperature Converter</title>
  </head>
 <body>
   <h1 class="title">This Program Converts Fahrenheit To Celsius and Celsius Fahrenheit</h1>  
   <h3 class='subtitle'>This may not be 100% accurate but I am trying to make it as accurate as I can</h3>
   <div class="FtoC">
     <p>Type in a number of Fahrenheit degrees to get it converted to Celsius</p>
     <input value="0">
     <button>Convert</button>
     <div id="output"></div>
   </div>
 </body> 
</html>

This CSS selector rule is simpler, too.

.FtoC {
  text-align: center;
}

Now things will get a little more complicated once C to F is added, but that should not take too much away from the simplicity we have here. KISS is the general rule. Simple, and non-repetitive.


#3

thank you for helping!