Hello Friends Today, through this tutorial, I will tell you How to Binary to Hexadecimal Convert Using Javascript with HTML? You can create a simple HTML page with JavaScript to convert binary to hexadecimal. Here’s an example:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Binary to Hexadecimal Converter</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
margin: 50px;
}
input {
padding: 5px;
font-size: 16px;
}
button {
padding: 8px;
font-size: 18px;
cursor: pointer;
}
#result {
margin-top: 20px;
font-size: 18px;
}
</style>
</head>
<body>
<h2>Binary to Hexadecimal Converter</h2>
<label for="binaryInput">Enter Binary:</label>
<input type="text" id="binaryInput" placeholder="Enter binary number" />
<button onclick="convertBinaryToHex()">Convert</button>
<div id="result"></div>
<script>
function convertBinaryToHex() {
// Get the binary input value
const binaryInput = document.getElementById('binaryInput').value;
// Check if the input is a valid binary number
if (!/^[01]+$/.test(binaryInput)) {
alert('Invalid binary input. Please enter a valid binary number.');
return;
}
// Convert binary to hexadecimal
const hexadecimalResult = parseInt(binaryInput, 2).toString(16).toUpperCase();
// Display the result
document.getElementById('result').innerHTML = `Hexadecimal: ${hexadecimalResult}`;
}
</script>
</body>
</html>
This example includes a simple HTML form with an input field for entering the binary number, a convert button, and a result display area. The JavaScript function `convertBinaryToHex` is triggered when the button is clicked, converting the binary input to hexadecimal and displaying the result.