By using this site, you agree to the Privacy Policy and Terms of Use.
Accept
rocoderesrocoderes
  • Home
  • HTML & CSS
    • Login and Registration Form
    • Card Design
    • Loader
  • JavaScript
  • Python
  • Internet
  • Landing Pages
  • Tools
    • Google Drive Direct Download Link Generator
    • Word Count
  • Games
    • House Painter
Notification Show More
Latest News
How to set the dropdown value by clicking on a table row
Javascript – How to set the dropdown value by clicking on a table row
JavaScript
Attempting to increase the counter, when the object's tag exist
Javascript – Attempting to increase the counter, when the object’s tag exist
JavaScript
Cycle2 JS center active slide
Javascript – Cycle2 JS center active slide
JavaScript
Can import all THREE.js post processing modules as ES6 modules except OutputPass
Javascript – Can import all THREE.js post processing modules as ES6 modules except OutputPass
JavaScript
How to return closest match for an array in Google Sheets Appscript
Javascript – How to return closest match for an array in Google Sheets Appscript
JavaScript
Aa
Aa
rocoderesrocoderes
Search
  • Home
  • HTML & CSS
    • Login and Registration Form
    • Card Design
    • Loader
  • JavaScript
  • Python
  • Internet
  • Landing Pages
  • Tools
    • Google Drive Direct Download Link Generator
    • Word Count
  • Games
    • House Painter
Follow US
High Quality Design Resources for Free.
rocoderes > JavaScript Program > How to Convert Kilometers to Miles and Celsius to Fahrenheit
JavaScript Program

How to Convert Kilometers to Miles and Celsius to Fahrenheit

Rocoderes
Last updated: 2022/08/28 at 3:10 PM
Rocoderes
Share
5 Min Read
How to Convert Kilometers to Miles and Celsius to Fahrenheit

In this article, we will make two programs to convert kilometers to miles and Celsius to Fahrenheit. These will be very easy program and also beginner-friendly. So we will try to learn these programs with easier explanation. So let’s create these programs one by one.

Contents
Kilometer to Miles ConvertorCelsius to Fahrenheit Convertor

So firstly we will make a convertor to convert kilometers to miles, and then we will see Celsius to Fahrenheit convertor.

Kilometer to Miles Convertor

In this firstly, we will add the HTML file as always, and we will use some HTML elements to get the user’s value. Here we have added an input field with number type, and we provided data as ID for this input field. Then we have added a button for convert, we also provided an event listener “onclick” in which we have added a function named convert(), which we will define in the JavaScript code. Here convert() function will trigger when we will click on the button, event listener listens the click event and call the provided function.

Now we also, added a <h1> with “res” ID, so we will add the result in this.

Let’s move to JS part, we have defined a function same name as we provided on the button. In this, we have declared a variable “kms” in which we have fetched input field value with its ID “data”. We have used document.getElementById('data') to target input field which have “data” ID. We used document.getElementById('data').value to get the value inside the input field. Now we have added a constant factor with the value 0.621371, this is basically, a value when we convert 1 km to miles. Now we have multiplied the factor and “kms” values, and store in the miles variable.

After that, we have fetched the “res” ID using document.getElementById('res'), and we have added the values of miles into the DOM using innerText property. In this, we have used ${miles} to write the value directly.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Addimg two numbers</title>
</head>
<body>
    <input type="number" id="data" step="any"/>Kms
    <button onclick="convert()">convert</button>
    <h1 id = "res"></h1>
    <script>
        function convert(){
            var kms = document.getElementById('data').value;
            const factor = 0.621371;
            var miles = kms * factor;
            document.getElementById('res').innerText = `${miles}`+ "miles";
        }
       

    </script>
    
</body>
</html>
How to Convert Kilometers to Miles and Celsius to Fahrenheit

Celsius to Fahrenheit Convertor

In this firstly, we will add the HTML file as always, and we will use some HTML elements to get the user’s value. Here we have added an input field with number type, and we provided data as ID for this input field. Then we have added a button for convert, we also provided an event listener “onclick” in which we have added a function named convert(), which we will define in the JavaScript code. Here convert() function will trigger when we will click on the button, event listener listens the click event and call the provided function.

Now we also, added a <h1> with “res” ID, so we will add the result in this.

Let’s move to JS part, we have defined a function same name as we provided on the button. In this, we have declared a variable “C” in which we have fetched input field value with its ID “data”. We have used document.getElementById('data') to target input field which have “data” ID. We used document.getElementById('data').value to get the value inside the input field. Now we have declared a variable “F” in which we have added a formula to convert Celsius to Fahrenheit.

After that, we have fetched the “res” ID using document.getElementById('res'), and we have added the values of miles into the DOM using innerText property. In this, we have used ${miles} to write the value directly.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Addimg two numbers</title>
</head>
<body>
    <input type="number" id="data" step="any"/>C
    <button onclick="convert()">convert</button>
    <h1 id = "res"></h1>
    <script>
        function convert(){
            var C = document.getElementById('data').value;
            var F = (C * 1.8) + 32;
            document.getElementById('res').innerText = `${F}`+ "F";
        }
       

    </script>
    
</body>
</html>
How to Convert Kilometers to Miles and Celsius to Fahrenheit

Related

Subscribe to Our Newsletter

Subscribe to our newsletter to get our newest articles instantly!

TAGGED: programs
Share this Article
Facebook Twitter Email Print
What do you think?
Love0
Sad0
Happy0
Sleepy0
Angry0
Dead0
Wink0
Posted by Rocoderes
Rocoderes is a blog you can learn HTML, CSS, JavaScript, React Js and Python along with creative coding stuff and free source code files.
Previous Article How to Add Two Numbers, Swap Two Numbers And Find Square Root in JavaScript How to Add Two Numbers, Swap Two Numbers And Find Square Root in JavaScript
Next Article How to Check If a Number is Positive, Negative, or Zero How to Check If a Number is Positive, Negative, or Zero
Leave a comment Leave a comment

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

- Advertisement -

You Might Also Like

Computing Fibonacci Sequence in JavaScript

Computing Fibonacci Sequence in JavaScript

January 12, 2023
Swap Two Numbers Without A Third Variable

How to Swap Two Numbers Without A Third Variable in JS

December 12, 2022
Armstrong Number

How to Find an Armstrong Number Using JavaScript

September 23, 2022
Print The Table

How to Print The Table of Any User Defined Number Using Function

September 22, 2022
rocoderesrocoderes
Follow US

Copyright © 2022 All Right Reserved By Rocoderes

  • Home
  • About us
  • Contact us
  • Disclaimer
Join Us!

Subscribe to our newsletter and never miss our latest news, podcasts etc.

Zero spam, Unsubscribe at any time.
Welcome Back!

Sign in to your account

Lost your password?