How to create a Length converter with HTML and JavaScript

Hello Friends, In this article we will discuss How to create a Length converter with HTML and JavaScript. If you want to create a Length converter with HTML and JavaScript. Then you are in the right place.

Create a Length converter

Create an input element that can change a value from one temperature measurement to another.

Convert from Miles to other Measurements

  • Convert from Miles to Feet- ft=mi*5280
  • Convert from Miles to Meters- m=mi/0.00062137
  • Convert from Miles to Inches- in=mi*63360
  • Convert from Miles to cm- cm=mi/0.0000062137
  • Convert from Miles to Yards- yd=mi*1760
  • Convert from Miles to Kilometers- km=mi/0.62137

Convert from Kilometers to other Measurements

  • Convert from Kilometers to Feet- ft=km*3280.8
  • Convert from Kilometers to Meters- m=km*1000
  • Convert from Kilometers to Inches- in=km*39370
  • Convert from Kilometers to cm- cm=km*100000
  • Convert from Kilometers to Yards- mi=km*1093.6
  • Convert from Kilometers to Miles- mi=km*0.62137

Convert from Yards to other Measurements

  • Convert from Yards to Feet- ft=yd*3
  • Convert from Yards to Meters- m=yd/1.0936
  • Convert from Yards to Inches- in=yd*36
  • Convert from Yards to cm- cm=yd/0.010936
  • Convert from Yards to Kilometers- km=yd/1093.6
  • Convert from Yards to Miles- mi=yd*0.00056818

Convert from Meters to other Measurements

  • Convert from Meters to Feet- ft=m*3.2808
  • Convert from Meters to Inches- in=m*39.370
  • Convert from Meters to cm- cm=m/0.01
  • Convert from Meters to Yards- yd=m*1.0936
  • Convert from Meters to Kilometers- km=m/1000
  • Convert from Meters to Miles- mi=m*0.00062137

Convert from Feet to other Measurements

  • Convert from Feet to Meters- m=ft/3.2808
  • Convert from Feet to Inches- in=ft*12
  • Convert from Feet to cm- cm=ft/0.032808
  • Convert from Feet to Yards- yd=ft*0.33333
  • Convert from Feet to Kilometers- km=ft/3280.8
  • Convert from Feet to Miles- mi=ft*0.00018939

Convert from Inches to other Measurements

  • Convert from Inches to Feet- ft=in*0.083333
  • Convert from Inches to Meters- m=in/39.370
  • Convert from Inches to cm- cm=in/0.39370
  • Convert from Inches to Yards- yd=in*0.027778
  • Convert from Inches to Kilometers- km=in/39370
  • Convert from Inches to Miles- mi=in*0.000015783Convert from cm to other Measurements
  • Convert from cm to Feet- ft=cm*0.032808
  • Convert from cm to Meters- m=cm/100
  • Convert from cm to Inches- in=cm*0.39370
  • Convert from cm to Yards- yd=cm*0.010936
  • Convert from cm to Kilometers- km=cm/100000
  • Convert from cm to Miles- mi=cm*0.0000062137

Length converter with HTML and JavaScript

HTML:

<p>
<label>Feet</label>
<input id=”inputFeet” type=”number” placeholder=”Feet”
oninput=”lengthConverter(this.value)” onchange=”lengthConverter(this.value)”>
</p>
<p>cm: <span id=”outputMeters”></span></p>

JavaScript:

function lengthConverter(valNum) {
document.getElementById(“outputMeters”).innerHTML = valNum / 0.0022046;
}

How to create a Length converter with HTML and JavaScript

<!DOCTYPE html>
<html>
<title>Feet to Meters Length Converter</title>
<body>

<h2>Length Converter</h2>
<p>Type a value in the Feet field to convert the value to Meters:</p>

<p>
<label>Feet</label>
<input id=”inputFeet” type=”number” placeholder=”Feet” oninput=”LengthConverter(this.value)” onchange=”LengthConverter(this.value)”>
</p>
<p>Meters: <span id=”outputMeters”></span></p>

<script>
function LengthConverter(valNum) {
document.getElementById(“outputMeters”).innerHTML=valNum/3.2808;
}
</script>
</body>
</html>

Read More:

Share this post if you found helpful!