Geek Answers Handbook

How to link my HTML with my jQuery?

Firstly, sorry for posting, I'm pretty new to coding, I will try to keep it short and sweet.

Simply put, when I include jQuery inline, IE code under my HTML, it works fine - the element I'm trying to animate is “hiding” and then “showing” how it should.

However, when I create my own separate jquery.js file and put the code there, it cannot display.

I have a cdn script from google and included this along with script and src, where my file is inside my project folder, but still no luck.

In my project folder, I have the folder 'script.js' and then inside this file 'jquery.js'.

Here is the code:

<head> <link rel="stylesheet" type="text/css" href="css/style.css"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> <script src="script.js/jquery.js"></script> </head> <div class="content"> <h2> Hi there</h2> <h3> Take a look...</h3> </div>

Here's jQuery:

 <script> $(document).ready(function() { $(".content").hide(1000).show(1000); }); </script>

("Checking" the problem in chrome, I get the error message "jquery.js: 1 Uncaught SyntaxError: Unexpected token <) - But I do not see where I am using '<' incorrectly.

Thanks in advance, and please feel free to tell me if I missed something important.

+6
source share
2 answers

You need to remove the <script> tags from the jquery.js file, these are the HTML tags that are used to implement embedded JS, the error you get is due to the fact that those tags are not valid JavaScript. Your JS file should look like this:

 $(document).ready(function() { $(".content").hide(1000).show(1000); });

Regarding folder naming, there is nothing wrong with having a period in the name of your folder, but as others suggested, it would probably be nice to remove the .js part from the name of your folder, even if it is not technically incorrect and not what causes your problem.

+12
source

Do not call your script.js folder, just name it "script".

-5
source

More articles:


All Articles