JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<section>
  <h1>ieee754 to decimal</h1>
  <form action="#" method="post">
    sign <input type="text" value="3"/>
    exp <input type="text" value="0"/>
    mantisse <input type="text" value="0"/>
    <input type="submit" value="go"/>
  </form>
  <div></div>
</section>
<hr/>
<section>
  <h1>hexa to decimal</h1>
  <form action="#" method="post">
    <input type="text" value="5A,12"/>
    <input type="submit" value="go"/>
  </form>
  <div></div>
</section>
</body>

JavaScript

var tag=function(str){
  return document.getElementsByTagName(str);
}
function IEEE754toFloat(S,E,M){
  var exp = Math.pow(2,parseInt(E,2)-Math.pow(2,E.length-1)+1),
  mantissa = 1+parseInt('0'+M,2)/Math.pow(2,M.length),
  sign = S==parseInt(1)?-1:1;
  return sign*exp*mantissa;
}
function pad(arr,i,n){
  arr[i]=(arr[i]+Array(n+1).join('0')).substring(0,n)
}
function processIEE754toFloat(){
  var arr = [].slice.call(tag('input')).map(n=>n.value);
  pad(arr,1,8);pad(arr,2,23);
  tag('div')[0].innerHTML = IEEE754toFloat.apply(null,arr.slice(0,3));
}
function hexaToDecimal(left,right){
  var left_10=parseInt(left,16);
  var right_10=parseInt(right,16)/Math.pow(16, right.length);
  return left_10+right_10;
}
function processHexaToDecimal(){
  var hexaNumber = [].slice.call(tag('input')).map(n=>n.value)[4].split(/,|\./);
  tag('div')[1].innerHTML = hexaToDecimal.apply(null,hexaNumber);
}
tag('form')[0].onsubmit=function(e){
  e.preventDefault();
  processIEE754toFloat();
  return false;
}
tag('form')[1].onsubmit=function(e){
  e.preventDefault();
  processHexaToDecimal();
  return false;
}