Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

How to create a length converter with HTML and JavaScript?


เพื่อสร้างเครื่องมือแปลงความยาวด้วย HTML และ JavaScript โค้ดมีดังนี้

ตัวอย่าง

<!DOCTYPE html> <html> <head> <style>    body{       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;    }    input,span{       font-size: 20px;    } </style> </head> <body> <h1>Length Converter</h1> <h2>Type length in Kilometers to convert it into meters</h2> <p> <label>Kilometers</label> <input id="inputKm" type="number" placeholder="Kilometers" oninput="KmtoMConverter(this.value)" onchange="KmtoMConverter(this.value)"> </p> <p>Meters: <span class="meters"></span></p> <script>    function KmtoMConverter(length) {       document.querySelector(".meters").innerHTML=length*1000;    } </script> </body> </html>

ผลลัพธ์

โค้ดข้างต้นจะสร้างผลลัพธ์ดังนี้ -

How to create a length converter with HTML and JavaScript?

เมื่อกรอกความยาวเป็นกิโลเมตร -

How to create a length converter with HTML and JavaScript?