<!DOCTYPE html><html><head>
<meta charset="utf-8">
<title>Conversor de Bases</title>
<style>
body {
font-family: "Consolas";
}
</style>
</head>
<body><h2>Conversor de Bases</h2>
Numeros:
<ul>
<li>Decimais, base 10 (0 a 10)</li>
<li>Hexadecimais, base 16 (0 a F)</li>
<li>Binários, base 2 (0 ou 1)</li>
<li>Octais, base 8 (0 a 7)</li>
</ul>
<!-- Interface HTML, campos de entrada e saída de dados -->
<table><tr><td align="right">
<label for="dec">Decimal:</label><br>
<label for="hex">Hexadecimal:</label><br>
<label for="bin">Binário:</label><br>
<label for="oct">Octal:</label></td><td>
<input type="number" id="dec" name="dec" oninput="d()"><br>
<input type="text" id="hex" name="hex" oninput="h()"><br>
<input type="number" id="bin" name="bin" oninput="b()"><br>
<input type="number" id="oct" name="oct" oninput="o()"><br>
</td></tr></table>
<!-- JS funções chamadas ao mudar os dados nos campos acima -->
<script>
function d() {
N = parseFloat(get("dec"));
put("hex", N.toString(16).toUpperCase());
put("bin", N.toString(2));
put("oct", N.toString(8));
}
function h() {
N = parseInt(get("hex"), 16);
put("dec", N);
put("bin", N.toString(2));
put("oct", N.toString(8));
}
function b() {
N = parseInt(get("bin"), 2);
put("dec", N);
put("hex", N.toString(16).toUpperCase());
put("oct", N.toString(8));
}
function o() {
N = parseInt(get("oct"), 8);
put("dec", N);
put("hex", N.toString(16).toUpperCase());
put("bin", N.toString(2));
}
function get(i) { // lê dado do campo i (input)
return document.getElementById(i).value;
}
function put(o,v) { // grava dado no campo o (output)
document.getElementById(o).value=v;
}
</script>
</body></html>