JavaScript Programming/Events/Example Code
Appearance
example.html
[edit | edit source]<!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="Cache-Control"content="no-cache"><title>Example</title><style>input{width:3em;}</style><scriptdefersrc="example.js"></script></head><body><noscript>Enable JavaScript to see web page content.</noscript><p><inputid="fahrenheit">° Fahrenheit is <outputid="celsius"></output>° Celsius</p></body></html>
example.js
[edit | edit source]// This program converts a Fahrenheit temperature to Celsius.//// References:// https://www.mathsisfun.com/temperature-conversion.html// https://en.wikibooks.org/wiki/JavaScript"use strict";constTEMPERATURE_DIFFERENCE=32;constTEMPERATURE_RATIO=5/9;window.addEventListener("load",function(){document.getElementById("fahrenheit").addEventListener("input",fahrenheitInput);});functionfahrenheitInput(){letfahrenheit=getFahrenheit();letcelsius=fahrenheitToCelsius(fahrenheit);displayResults(fahrenheit,celsius);}functiongetFahrenheit(){letfahrenheit=document.getElementById("fahrenheit").value;fahrenheit=Number(fahrenheit);returnfahrenheit;}functionfahrenheitToCelsius(fahrenheit){letcelsius=(fahrenheit-TEMPERATURE_DIFFERENCE)*TEMPERATURE_RATIO;returncelsius;}functiondisplayResults(fahrenheit,celsius){celsius=celsius.toFixed(1);document.getElementById("celsius").innerText=celsius;}