fraction calculation

by justmeet0924

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <p>数値 <span id="span"></span></p>
        <input type="number" id="number">
        <input type="button" value="ボタン" onclick="fraction()">
        <div id="main">
            <div id="question"><p>   </p></div>
            <div id="answer">
                <div id="numerator" width="200px" height="200px"><p>   </p></div>
                <div id="denominator" width="200px" height="200px"><p>   </p></div>
            </div>
        </div>
    </body>
    <script src="script.js"></script>
</html>

CSS

div{
    font-size: 100px;
}
#main{
    background-color: aqua;
    display: block;
}
#question{
    padding: 0.5em 1em;
    margin: 2em 0;
    background-color: bisque;
    border: solid 3px #6091d3;/*線*/
    border-radius: 10px;/*角の丸み*/
    display: inline-block;
}
#answer{
    color: white;
    background-color: #6091d3;
    border-radius: 10px;/*角の丸み*/
    display: block;
}
#numerator{
    color: white;
    background-color: #6091d3;
    border-radius: 10px;/*角の丸み*/
}
#denominator{
    color: white;
    background-color: #6091d3;
    border-radius: 10px;/*角の丸み*/
}

JavaScript

function fraction(){
    const number = document.getElementById("number").value;
    console.log(number);
    const numberDigit = String(number).length;
    var numerator = 0;
    var denominator = 0;
    for(let i=0; i<numberDigit; i++){
        denominator += Math.pow(10,i)*9;
    }
    numerator = number;
    const answer = numerator/denominator;
    console.log(answer);
    console.log(denominator);
    var g = gcd(numerator,denominator);
    var numerator_2 = numerator/g;
    var denominator_2 = denominator/g;
    document.getElementById("numerator").textContent = numerator_2;
    document.getElementById("denominator").textContent = denominator_2;
    document.getElementById("question").textContent = "0."+String(number)+String(number)+"...";
}

console.log(gcd(12,32));

function gcd(m, n) {
    // 剰余
    var r;
  
    if(m < n) {  // m >= nにする
      r = m;  //一時退避
      m = n;
      n = r;
    }
  
    while ((r = m % n) != 0) {
      m = n;
      n = r;
    }
  
    return n;
  }