How do I link a JavaScript file to a HTML file?
html, javascript, jquery
Solution
First you need to download the jQuery library from https://jquery.com/ then load the jQuery library the following way within your HTML head tags.
Then you can test whether jQuery is working by adding your jQuery code after the jQuery loading script.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--LINK JQUERY-->
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<!--PERSONAL SCRIPT JavaScript-->
<script type="text/javascript">
$(function(){
alert("My First jQuery Test");
});
</script>
</head>
<body><!-- Your web page --></body>
</html>
If you want to use your jQuery scripts file separately, you must define the external .js file this way after the jQuery library loading.
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script src="js/YourExternalJQueryScripts.js"></script>
Test in real time
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--LINK JQUERY-->
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<!--PERSONAL SCRIPT JavaScript-->
<script type="text/javascript">
$(function(){
alert("My First jQuery Test");
});
</script>
</head>
<body><!-- Your web page --></body>
</html>
Problem
How do you properly link a JavaScript file to a HTML document? Secondly, how do you use jQuery within a JavaScript file?