Trying to connect JS and HTML. Receiving ERR_FILE NOT_FOUND

Question

I'm a relative beginner so apologies if this is a dumb question. I have no idea if I'm using the wrong path while trying to link my JS to HTML. I've tried absolute paths, adding the files to a JS folder in the root folder. I can't even get jQuery to link. Here's a snippet:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Guessing Game</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="stylesheet" type="text/css" href="bootstrap.css">
    <link rel="stylesheet" type="text/css" href="bootstrap-theme.css">
    <!-- Bootstrap and CSS here-->

  </head>
  <body>

      <div id='app' class='center' class='container'>

        <div id='headers'>
          <!-- Title and subtitles! -->
          <h1 id='title'> Rav's Cheesy Guessing Game! </h1>
          <h2 id='subtitle'> Guess A Number Between 1-100, You Won't </h2>
        </div>

        <div id='main'>
          <div id='input-parent'>
            <!-- Player's guess input, and submit button -->
            <input id='player-input' class='center' placeholder="#" autofocus maxlength=2></input>
            <button id='submit-button' type=submit>Go!</button>
          </div>

          <div id='guesses'>
            <ul id='guess-list'>
              <li class='guess'>_</li>
              <li class='guess'>_</li>
              <li class='guess'>_</li>
              <li class='guess'>_</li>
              <li class='guess'>_</li>
            </ul>
            <!-- unordered list of guesses -->
          </div>

          <div id="menu-btns">
            <!-- reset and hint buttons -->
            <button id='reset' class='btn btn-warning btn-sm'>Reset</button>
            <button id='hint' class='btn btn-primary btn-sm'>Hint</button>
          </div>
        </div>
      </div>



    <div id='footer' class='center' class="container">
        <div class="row">
          <div class='col-md-4 col-sm-4'>
            <img src='fa-logo@2x.png'>
          </div>

          <div class='col-md-4 col-sm-4'>
            <h4>Project by Ravish Rawal</h4>
          </div>

          <div class='col-md-4 col-sm-4'>
            <img src='grace_hopper_academy.png'>
          </div>

        </div>
    </div>
    <script type='text/javascript' src='js/jquery.min.js'></script>
    <script type='text/javascript' src='js/GuessingGame.js'></script>
  </body>
</html>

@Pyromonk Placing them in the body has the advantage of not having to wait for any 'load' event before accessing the DOM. — le_m, Jun 05 '17 at 00:26
Possible duplicate of [How do I link a JavaScript file to a HTML file?](https://stackoverflow.com/questions/13739568/how-do-i-link-a-javascript-file-to-a-html-file) — mercador, Jun 05 '17 at 00:26
@Pyromonk - [That's not always, or even mostly these days, true.](https://stackoverflow.com/q/5329807/451969) — Jared Farrish, Jun 05 '17 at 00:27

score 1 · Answer 1 · answered Jun 05 '17 at 00:27

Here is all you need to know about relative file paths:

Starting with "/" returns to the root directory and starts there

Starting with "../" moves one directory backwards and starts there

Starting with "../../" moves two directories backwards and starts there (and so on...)

To move forward, just start with the first subdirectory and keep moving forward

Here is the reference

score 0 · Answer 2 · answered Jun 05 '17 at 00:26

0

If your using IIS (a localhost), there could be any number of things wrong. For now, just check the paths. You can use literally copy the path of it in file explorer (if on windows).

answered Jun 05 '17 at 00:26

score 0 · Answer 3 · answered Jun 05 '17 at 00:40

0

For root you need to Type this "/"
this will returns to the root directory and starts there

answered Jun 05 '17 at 00:40

Akitha_MJ

3,882
25
20

Trying to connect JS and HTML. Receiving ERR_FILE NOT_FOUND

3 Answers3