What "might" I be doing wrong with this snippet?

jPaulB · Sep 25, 2023

Hi Everybody,
I'm just getting started with JavaScript but I'm frozen on this tiny example. What am, I doing wrong with it?

HTML:

<!DOCTYPE HTML>
<html>
    <head>
        <title>JavaScript Tests</title>
        <script src="playtime.js"></script>
    </head>
    <body onload="countToTen()">
        <h1>Lets count to TEN</h1>
        <p id="theCount"></p>
    </body>
</html>

Code:

JavaScript:

 function (countToTen) {
     var count = 0;
    while (count < 10 ) {
        count++;
        document.getElementById("theCount"). innerHTML += count +"<br>";
    }
 }

Both files, index.html and playtime.js are in the same directory, but the JavaScript code will not execute. It works fine as a single HTML file like this:

HTML:

OCTYPE HTML>
<html>
    <head>
        <title>JavaScript Tests</title>
    </head>
    <body onload="countToTen()">
        <h1>Lets count to TEN</h1>
        <p id="theCount"></p>
        <script>
             var count = 0;
            while (count < 10 ) {
               count++;
               document.getElementById("theCount"). innerHTML += count +"<br>";
             }
        </script>
    </body>
</html>

VBService · Sep 25, 2023

1.
[ on-line ]

HTML:

<html>
  <head>
    <title>JavaScript Tests</title>
    <script src="playtime.js"></script>
  </head>
  <body onload="countToTen()">
    <h1>Lets count to TEN</h1>
    <p id="theCount"></p>
  </body>
</html>

JavaScript:

function countToTen() {
  let count = 0;
  while (count < 10) {
    count++;
    document.getElementById("theCount"). innerHTML += count +"<br>";
  }
 }

or

JavaScript:

function countToTen() {
  let count = 0;
  while (count < 10)
    document.getElementById("theCount").innerHTML += (++count) +"<br>";
 }

or

JavaScript:

function countToTen(count=0) {
  while (count < 10)
    document.getElementById("theCount").innerHTML += (++count) +"<br>";
}

2.
[ on-line ]

HTML:

<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript Tests</title>
  </head>
  <body>
    <h1>Lets count to TEN</h1>
    <p id="theCount"></p>

    <script>
      window.onload = countToTen;

      function countToTen() {
        let count = 0;
        while (count < 10) {
          count++;
          document.getElementById("theCount").innerHTML += count +"<br>";
        }
      }
    </script>
  </body>
</html>

BTW, check
[ on-line ]

HTML:

<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript Tests</title>

    <style>
      pre {
        font: 400 1rem/1.05 system-ui, monospace;
      }
    </style>
  </head>
  <body>
    <h1>Lets count to TEN</h1>
    <pre id="theCount"></pre>

    <script>
      window.onload = () => {
        const intervalID = setInterval(() => {         
          document.getElementById('theCount').textContent += count + '\n';
          if (++count > 10) clearInterval(intervalID);
        }, 1000, count=1);
      };
    </script>
  </body>
</html>

jPaulB · Sep 26, 2023

Where did I go wrong in the script I was trying to study?

VBService · Sep 26, 2023

jPaulB said:
function (countToTen) {

Here you have a mistake.

The code you've provided appears to be an anonymous JavaScript function declaration, but it lacks a proper function name. In JavaScript, functions should have a name or be assigned to a variable for later use or invocation.

JavaScript:

function countToTen() {
  // ...
}

In this corrected code, we've given the function a name, "countToTen," which allows you to call it later in your code using countToTen(). Without a function name, you won't be able to call or reference the function in your program, which is a common mistake.

or

JavaScript:

const countToTen = () => {
  // ...
}

jPaulB · Sep 26, 2023

Thank You Thank You Thank You Thank You.

I have been staring at my original code for over a week before I placed that inquiry on this forum. I just couldn't see what was wrong.

My eyes were crossed, my head pounded, my self-doubt was getting serious. Thank you for pointing out where the issue was. My fear of impending dementia is going away slowly.

Padonak · Sep 27, 2023

jPaulB said:
My fear of impending dementia is going away slowly.

Paul, do not hesitate checking the browser Console for errors. This feature can be easily display by pressing F12. Doing this could save a week of your life at least

VBService · Sep 27, 2023

@jPaulB check this: Modern JavaScript From The Beginning

About as basic "Newbie-Question" that you can get.	3	Sep 4, 2023
How do I output this recursive function correctly to a web browser?	2	Dec 17, 2022
Graph of quadratic function with CanvasRenderingContext2D	2	May 9, 2024
I Need Help with making a function that draws in a canvas using location data.	1	Dec 17, 2021
Issue with textbox script?	0	Sep 5, 2022
I am trying to make an audio player, how do I get the selected file to be playable?	5	Mar 29, 2022
Only one table shows up with the information	2	Mar 29, 2023
Script stops working when using variables to save time typing...	4	Oct 31, 2022

What "might" I be doing wrong with this snippet?

jPaulB

VBService

jPaulB

VBService

jPaulB

Padonak

VBService

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads