-4

Using jQuery CDN for JavaScript will give

$ is not defined error.

and

Failed to load resource: the server responded with a status of 404 (Not Found)

this console error occurs

Can't load jQuery?

<script src = "https://code.jquery.com/jquery-3.4.1.min.js"> </ script>

I used to load a CDN

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

I linked it with my folder. I tried changing the order.

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="js/default.js"></script>

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> My name's lEEGANG</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="js/default.js"></script> <!--js파일 연결-->
<!--<script type="text/javascript" src="js/default.js"></script>-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, target-densitydpi=medium-dpi">
<meta name="format-detection" content="telephone=no">  

default.js

$(document).ready(function() { 
$(".all").on("click", function() {

    $(".nav").addClass("on");

    });
});

default.js all code is an ERROR

ERROR:'$' is not defined.[no-undef]

and

ERROR:'document' is not defined.[no-undef]

Sfili_81
  • 2,377
  • 8
  • 27
  • 36

2 Answers2

0

I Tried your code found no issue try This

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
</head>
<body>
<div class="nav-wrap">
  <ul class="nav">
    <li class="all">Level One</li>
    <li>Level One</li>
    <li>Level One</li>
  </ul>
</div>
</body>
<script src = "https://code.jquery.com/jquery-3.4.1.min.js"></script>

<script>
  $(document).ready(function() { 
  $(".all").on("click", function() {

      $(".nav").addClass("on");

      });
  });
</script>

</html>

Note: Check the path properly. You are using document.ready function that is fine, still try once script after body tag like this.

Front End Coder
  • 458
  • 2
  • 8
0

Try This:-

.on{color:red;}
<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
</head>
<body>
<div class="nav-wrap">
  <ul class="nav">
    <li class="all">Level One</li>
    <li>Level One</li>
    <li>Level One</li>
  </ul>
</div>
</body>
<script src = "https://code.jquery.com/jquery-3.4.1.min.js"></script>

<script>
  $(document).ready(function() { 
    $(document).on("click", ".all", function() {
      alert();
      $(".nav").addClass("on");
    });
  });
</script>

</html>
satish mallick
  • 625
  • 5
  • 9