Live server isn't running scripts-CodePudding

I'm on chrome on a Mac, and the index file runs but the script doesn't change anything. I tried just removing paragraphs and that doesn't work either. I tried hard refreshing and running from the Live extension.

This is the code from Index.html

<!DOCTYPE html>
 
<html>
    <head>
        <h1> I've a lot of things to do today.</h1>
    </head>
    <body>
        <p> 1. Get the litter & Wet Food.</p>
        <p> 2. Clean the Room.</p>
        <p> 3. Go out with the girlfriend.</p>
        <p> 4. Teach Rishabh.</p>
        <p> 5. Watch a show.</p>
        <p> 6. DON'T GET ANYMORE NFTS SER.</p>
        <script scr="scripts.js"></script>
    </body>
</html>

and scripts.js

let ps = document.querySelectorAll('p')
ps.forEach(function(p){
    p.remove()
})

The script isn't called at all because even a simple console.log statement in the scripts.js file won't run. No errors either :/

Thanks a lot for the help. I'm super new and this has been kinda frustrating.

CodePudding user response：

Everything is perfectly Fine, but I would say you to not to use the h1 in the head tag.

The problem with the snippet provided is that there is a typo in the source definition of the script!
Use the correct definition for the source src in place of the scr.

<script src="script.js"></script>

CodePudding user response：

You can't write h1 like this in head, head is used for meta-data, link, and other things to configure html page before loading. If you want, you can set a title in head to replace your h1 or move your h1 in your body. Rest of your content should be in body.

Edit : And you have a spell error, it's src not "scr" for import your script !

<html>
  <head>
    <title>To Do Page</title>
  </head>
  <body>
    <h1>I've a lot of things to do today.</h1>
    <p>1. Get the litter & Wet Food.</p>
    <p>2. Clean the Room.</p>
    <p>3. Go out with the girlfriend.</p>
    <p>4. Teach Rishabh.</p>
    <p>5. Watch a show.</p>
    <p>6. DON'T GET ANYMORE NFTS SER.</p>
    <script src="./scripts.js" type="text/javascript"></script>
  </body>
</html>

You may run a little console.log() for ensure your import is fine, before working on script like this, if the log, at top of the js file doesn't not appear in your console browser, the script is probably not imported.


console.log("test");

let ps = document.querySelectorAll("p");
ps.forEach(function (p) {
  p.remove();
});

CodePudding user response：

Please Correct your spelling . scr. it should be src

CodePudding user response：

So spelling mistakes often happen in code you go nuts trying to figure out what you did wrong use this as a learning experience.