Bytes Converterbytes_________ KB_________ MB_________ GB |
Bytes ConverterPreviously I took some modules that required quite a lot conversion between Bytes to KB, MB or GB depending on the question, as it's required in the module the conversion is not simply the normal base 10 systems, in our curriculum we are taking 1 KB as 1024 bytes is is a simple tool to help check the answers when you are practicing.
I just thought of this will be good for me to further practice coding in HTML and JS. To further understand why 1 KB = 1024 bytes feel free to head here, where the author give a good explanation. As usual codes listed below. Do let me know if there are any bugs and comments. |
<!DOCTYPE html>
<html>
<body>
<h1 id="header">Bytes Converter</h1>
<input id="byte"> bytes<br>
<script>
function myFunction() {
var KBout = document.getElementById("KBtext");
var MBout = document.getElementById("MBtext");
var GBout = document.getElementById("GBtext");
var byteIn = document.getElementById("byte").value;
var KB = byteIn / 1024;
var MB = byteIn /(1024 * 1024);
var GB = byteIn /(1024 * 1024 * 1024);
KBout.innerHTML = KB + " KB";
MBout.innerHTML = MB + " MB";
GBout.innerHTML = GB + " GB";
}
</script>
<h3 id = "KBtext"> _________ KB</h3>
<h3 id = "MBtext"> _________ MB</h3>
<h3 id = "GBtext"> _________ GB</h3>
<button onclick="myFunction()">Convert</button>
</body>
</html>
<html>
<body>
<h1 id="header">Bytes Converter</h1>
<input id="byte"> bytes<br>
<script>
function myFunction() {
var KBout = document.getElementById("KBtext");
var MBout = document.getElementById("MBtext");
var GBout = document.getElementById("GBtext");
var byteIn = document.getElementById("byte").value;
var KB = byteIn / 1024;
var MB = byteIn /(1024 * 1024);
var GB = byteIn /(1024 * 1024 * 1024);
KBout.innerHTML = KB + " KB";
MBout.innerHTML = MB + " MB";
GBout.innerHTML = GB + " GB";
}
</script>
<h3 id = "KBtext"> _________ KB</h3>
<h3 id = "MBtext"> _________ MB</h3>
<h3 id = "GBtext"> _________ GB</h3>
<button onclick="myFunction()">Convert</button>
</body>
</html>