Hello Friends Today, through this tutorial, I will tell you How to Electron-volts to Volts calculator tool created using JavaScript with HTML? Below is an example of an Electron-volts to Volts calculator tool created using JavaScript with HTML. It allows users to input energy in electron-volts (eV) and converts it to volts (V).
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Electron-volts to Volts Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
label {
display: block;
margin-bottom: 8px;
}
input {
width: 100%;
padding: 8px;
margin-bottom: 16px;
box-sizing: border-box;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 15px;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<h2>Electron-volts to Volts Calculator</h2>
<label for="electronVolts">Enter Energy in Electron-volts (eV):</label>
<input type="number" id="electronVolts" placeholder="Enter energy in eV">
<button onclick="convertToVolts()">Convert to Volts</button>
<p id="result"></p>
<script>
function convertToVolts() {
// Get the energy in electron-volts input value
const energyInEV = parseFloat(document.getElementById('electronVolts').value);
// Conversion factor: 1 eV = 1.602 x 10^-19 volts
const conversionFactor = 1.602e-19;
// Calculate energy in volts
const energyInVolts = energyInEV * conversionFactor;
// Display the result
document.getElementById('result').innerHTML = `Energy in Volts: ${energyInVolts} V`;
}
</script>
</body>
</html>
This HTML file creates a simple Electron-volts to Volts calculator tool. Users can input energy in electron-volts (eV), and upon clicking the “Convert to Volts” button, the entered energy is converted to volts (V) using the conversion factor of 1 electron-volt (eV) equals 1.602 x 10^-19 volts. The calculated energy in volts is then displayed below the button.