Home>

We are creating a program that applies FizzBuzz.

I want to program so that the following is displayed, but it doesn't work.
By entering numbers in FuzzNum and BizzNum and pressing the execute button
1. Display multiples of the value entered in fizzNum and multiples of the value entered in buzzNum in ascending order
2. Display fizz and buzz with multiples respectively
3. Display fizzBuzz when it is a multiple of both

I want to do it like the image, but I can't do it well.
How can I fix it to display it correctly?

Corresponding source code
<body>
     FizzBuzz problem 
  <p>FuzzNum</p>
  <input type = "text">
  <p>BizzNum</p>
  <input type = "text">
  <button>Run</button>
  <p>[Output]</p>
  <ul>
  </ul>
  <script>
Document.querySelector ("button"). addEventListener ('click', () =>{
        const ul = document.getElementById ("unserlist");
        const text1 = document.getElementById ("num1"). value;
        const text2 = document.getElementById ("num2"). value;
        for (let i = 1;i<= 100;i ++) {
            const li = document.createElement ("li")
            if (text1 * i<100) {
                li.textContent = (`Fuzz ${text1 * i}`)
                ul.appendChild (li)
            } else if (text2 * i<100) {
                li.textContent = (`Bizz ${text2 * i}`)
                ul.appendChild (li)
            } else if (((text1 * i === text2 * i) || (text1 * text2 * i)<100)) {
                li.textContent = (`FuzzBizz ${text1 * text2 * i}`)
                ul.appendChild (li)
            }
        }
</Script>
</body>
The problem i am having

The program ends when the first FuzzNum is displayed.
How can I display it like an image on top of it?

  • Answer # 1

    Since i is added in the for loop,

    If i is a multiple of text1 and a multiple of text2FizzBuzz ${i}And output
    Otherwise, if i is a multiple of text1,Fizz ${i}And output
    Otherwise, if i is a multiple of text2Buzz ${i}And output

    You can use logic like this.

    To check if it is a multiple, use the remainder operator (%) to find the remainder, and if it is 0, it can be judged as a multiple.

  • Answer # 2

    Do you understand the behavior of the relevant source code?
    A quick glance, I'm trying to "create" multiples of FuzzNum and buzzNum, but as a requirement

    1. Display multiples of the value entered in fizzNum and multiples of the value entered in buzzNum in ascending order

    Therefore, if it is realized in this direction, it is necessary to sort all the created numbers after putting them together in an array. (It is also necessary to extract multiples of both)
    Also, since we are doing something that the branching conditions have shifted, please review the flow.

    The quickest way is to see if the incremented numbers are multiples of FuzzNum and buzzNum, but I prefer the current direction, so do your best.