I can't manage to successfully link jQuery to my html. I have made the most simple jQuery code possible just so I know it's right, and I've tried everything I can think of - searching hasn't been helpful..
my html(file name: "test.html":
<!DOCTYPE html> <html> <head> <title>Test</title> <link rel="stylesheet" type="css/text" href="test.css"/> <script type="text/javascript" src="test.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> </head> <body> <div id="orange"></div> </body> </html>
my CSS(file name: "test.css"):
#orange { height: 100px; width: 100px; background-color: orange; border-radius: 5px; border: 3px solid black; margin-left: 100px; margin-top: 100px; display: none; }
my JS(file name: "test.js"):
$(document).ready(function() { $('div').fadeIn('slow'); });
The console is showing that the jQuery link is loading in 6.52s.
I have also tried to link from the jQuery file I downloaded at
<script src="C:\jQuery\jquery.js"></script>
which also failed miserably...
I did however manage to link jQuery UI somehow and run ".accordion()"... =/
By downloading the jQuery library locally 0. min. js file in a directory of your website, e.g. /jquery. We can link jQuery in an HTML page by using a script tag and providing the downloaded jQuery library file address as the src attribute.
At its core, jQuery is used to connect with HTML elements in the browser via the DOM. The Document Object Model (DOM) is the method by which JavaScript (and jQuery) interact with the HTML in a browser. To view exactly what the DOM is, in your web browser, right click on the current web page select “Inspect”.
In this case, your test.js
will not run, because you're loading it before jQuery. put it after jQuery:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <script type="text/javascript" src="test.js"></script>
Add your test.js file after the jQuery libraries. This way your test.js file can use the libraries.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With