主要需求:十進制轉二進制,可以控制指定的位數。
轉化顯示后的二進制數為bin-bit中輸入的數字寬度。
dec-number為5,bin-bit為5,則轉化后數字為00101。
如果bin-bit小於轉化后的二進制本身位數,則使用原本的位數,如dec-number為5,bin-bit為2,依然輸出101,但同時在console中報個錯。
一、十進制轉二進制,不控制位數。
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>10進制轉2進制,不帶位數控制</title> 7 </head> 8 9 <body> 10 <input id="dec-number" type="number" placeholder="輸入一個十進制非負整數"> 11 <button id="trans-btn">轉化為二進制</button> 12 <p id="result">運算結果</p> 13 <script> 14 //點擊事件 15 document.getElementById("trans-btn").onclick = function () { 16 var x = document.getElementById("dec-number").value; 17 dec2bin(x); 18 } 19 20 function dec2bin(decNumber) { 21 // 在這里實現你的轉化方法,注意需要判斷輸入必須為一個非負整數 22 if (decNumber < 0) { 23 alert("請輸入一個非負整數"); 24 } else { 25 var q = binary(decNumber); 26 document.getElementById("result").innerHTML = ("計算結果為:" + q); 27 } 28 } 29 30 // 實現黨點擊轉化按鈕時,將輸入的十進制數字轉化為二進制,並顯示在result的p標簽內 31 // Some coding 32 33 function binary(num) { 34 var resArry = []; 35 var xresArry = []; 36 i = 0; 37 //除2取余 38 for (; num > 0;) { 39 resArry.push(num % 2); 40 num = parseInt(num / 2); 41 i++; 42 } 43 //倒序排列 44 for (j = i - 1; j >= 0; j--) { 45 xresArry.push(resArry[j]); 46 } 47 return xresArry.join().replace(/,/g, ""); 48 } 49 </script> 50 </body> 51 52 </html>
二、十進制轉二進制,控制位數。
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>10進制轉2進制,帶位數控制</title> 7 </head> 8 9 <body> 10 <input id="dec-number" type="number" placeholder="輸入一個十進制非負整數"> 11 <input id="bin-bit" type="number" placeholder="輸入需要顯示的位數"> 12 <button id="trans-btn">轉化為二進制</button> 13 <p id="result">運算結果</p> 14 <script> 15 //點擊事件 16 document.getElementById("trans-btn").onclick = function () { 17 var x = document.getElementById("dec-number").value; 18 var y = document.getElementById("bin-bit").value; 19 dec2bin(x, y); 20 } 21 22 function dec2bin(decNumber, bit) { 23 // 在這里實現你的轉化方法,注意需要判斷輸入必須為一個非負整數 24 if (decNumber < 0) { 25 alert("請輸入一個非負整數"); 26 } else { 27 var q = binary(decNumber, bit); 28 document.getElementById("result").innerHTML = ("計算結果為:" + q); 29 } 30 } 31 32 // 實現黨點擊轉化按鈕時,將輸入的十進制數字轉化為二進制,並顯示在result的p標簽內 33 // Some coding 34 35 function binary(num, Bits) { 36 var resArry = []; 37 var xresArry = []; 38 i = 0; 39 //除2取余 40 for (; num > 0;) { 41 resArry.push(num % 2); 42 num = parseInt(num / 2); 43 i++; 44 } 45 //倒序排列 46 for (j = i - 1; j >= 0; j--) { 47 xresArry.push(resArry[j]); 48 } 49 //報錯 50 if (Bits < xresArry.length) { 51 console.log("控制位小於轉換位數"); 52 } 53 //補0操作 54 if (Bits) { 55 for (r = xresArry.length; r < Bits; r++) { 56 xresArry.unshift("0"); 57 } 58 } 59 return xresArry.join().replace(/,/g, ""); 60 } 61 </script> 62 </body> 63 64 </html>
涉及的知識點:
十進制轉二進制,除2取余,倒序排列。
push()
unshift()
join()
replace()
<input placeholder="請輸入">