Skip to content

JavaScript not printing out values

So I’m trying to print all values of x,y,z from this equation x − 2y + 3z = 0 (value of between 1-5, the value of y is between 6-10, and z is between 3-7) on HTML through javascript but the

document.getElementById("display").innerHTML = x,y,z;  

Only displays the maximum value of x, y, z. instead of any possible solution. So I’m unsure whether there is a problem with the for loops and the way I’m trying to display on the HTML page. This is the output I want

function Solve() {
    {
        var x = [];
        var y = [];
        var z = [];
        var ans = [];
        // x-2y+3z=0
        // x3[1,5] y3[6,10] z3[3,7]
        console.log("xtytznn");
        for (x = 1; x <= 5; x++) {
            for (y = 6; y <= 10; y++) {
                z = (2 * y - x) / 3.0;
                if (x >= 0 && y >= 0 && z >= 0) {
                    if (x % 1 == 0 && y % 1 == 0 && z % 1 == 0) {
                        if (x >= 1 && x <= 5 && y >= 6 && y <= 10 && z >= 3 && z <= 7) {
                            (document.getElementById("display").innerHTML = x), y, z;
                        }
                    }
                }
            }
        }
        for (y = 6; y <= 10; y++) {
            for (z = 3; z <= 7; z++) {
                x = 2 * y - 3 * z;
                if (x >= 0 && y >= 0 && z >= 0) {
                    if (x % 1 == 0 && y % 1 == 0 && z % 1 == 0) {
                        if (x >= 1 && x <= 5 && y >= 6 && y <= 10 && z >= 3 && z <= 7) {
                            document.getElementById("display").innerHTML = y;
                        }
                    }
                }
            }
        }
        for (z = 3; z <= 7; z++) {
            for (x = 1; x <= 5; x++) {
                y = (x + 3 * z) / 3.0;
                if (x >= 0 && y >= 0 && z >= 0) {
                    if (x % 1 == 0 && y % 1 == 0 && z % 1 == 0) {
                        if (x >= 1 && x <= 5 && y >= 6 && y <= 10 && z >= 3 && z <= 7) {
                            document.getElementById("display").innerHTML = z;
                        }
                    }
                }
            }
        }
    }
}
<center>
    <p>x - 2y + 3z = 0</p>
    <button onclick="Solve()">Solve</button><br />

    <span id="display"></span>

    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
    <span id="display"></span>
</center>

Answer

You can try following code to print the solutions for the equation:

html:

<center>
    <p>x - 2y + 3z = 0</p>
    <button onclick="Solve()">Solve</button><br />
    <div id="solution" style="color: green"></div>
</center>

javascript :

function Solve()
{
    const solutions=[];
    for(let x=1;x<=5;x++)
        for(let y=6;y<=10;y++)
            for(let z=3;z<=7;z++)
                if (x-2*y+3*z==0)
                    solutions.push([x,y,z]);
                    
   var solutionElement = document.getElementById("solution");
   solutionElement.innerText  = "The solutions are:"
   solutions.forEach(solution => {
   const node = document.createElement("div");
   node.innerText = `x= ${solution[0]}, y=${solution[1]}, z=${solution[2]}`;
   solutionElement.appendChild(node);
   });
}

PS: You can apply style however you want.