I am using sublime and trying to practice building a site. Here's the HTML and JS that I am trying to connect, please tell me what I'm doing wrong because the alert is not ing up when I open index.html in Chrome.
<!DOCTYPE html>
<head>
<link href=':300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" src="script.js"></script>
</head>
$(document).ready(function(){
alert("Hello World");
});
Thank you!
I am using sublime and trying to practice building a site. Here's the HTML and JS that I am trying to connect, please tell me what I'm doing wrong because the alert is not ing up when I open index.html in Chrome.
<!DOCTYPE html>
<head>
<link href='http://fonts.googleapis./css?family=Quicksand:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" src="script.js"></script>
</head>
$(document).ready(function(){
alert("Hello World");
});
Thank you!
Share Improve this question edited Oct 4, 2022 at 15:22 Daniel Widdis 9,13113 gold badges48 silver badges68 bronze badges asked Mar 23, 2014 at 19:33 BetzycBetzyc 471 gold badge1 silver badge5 bronze badges 2- 1 Where have you added jQuery? – Teemu Commented Mar 23, 2014 at 19:34
- It's written in another file called "script.js" and I want to link to it like the linking to my css file – Betzyc Commented Mar 23, 2014 at 19:45
4 Answers
Reset to default 3You need to put javascript code in <script></script> tags:
<!DOCTYPE html>
<head>
<link href='http://fonts.googleapis./css?family=Quicksand:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" src="script.js"></script>
<script>
$(document).ready(function(){
alert("Hello World");
});
</script>
</head>
And since you are using ready method of jQuery, make sure it is included first before using it with:
<script type="text/javascript" src="jquery.js"></script>
To use this you must include both jQuery and surround the javaScript with tags. If, however, you want to include everything in script.js, it might not be the best thing to write everything in tags, just write everything in "script.js"
index.html
<head>
<script src="jquery-1.10.2.min.js"></script>
<link href='http://fonts.googleapis./css?family=Quicksand:300' rel='stylesheet'type='text/css'>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" src="script.js"></script>
</head>
script.js
$(document).ready(function(){
alert("Hello World");
});
This should do the trick. (also remember that if you use this kind of import, you have to place script.js in the same folder. If you placed it in a different folder such as 'js' you have to do a import like:
<script type='text/javascript' src="js/script.js"></script>
This is very simple stuffs which new people to JavaScript may miss it, there are two ways to do it:
1) in Simple structure of HTML page, everything in the page is counted as HTML unless they are in <script> or <style> tags, so in your case you need to do it inside <script> tag like this:
<html>
<head>
<link href='http://fonts.googleapis./css?family=Quicksand:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert("Hello World");
});
</script>
</head>
<body>
</body>
</html>2) You may want it in separate file, like the link you did it to script.js, in this case, just simply put the js file in script.js without any <script> tag...
add jquery!
download here http://jquery./download/ and add in head section
<script src="filejquerywithpath" type="text/javascript"></script>
Howhever if you want include jquery in other file and include only this file, you can add the line code above in a file html and in the head section add this line code that write te content in output
<% Response.WriteFile("file.html"); %>
All content of file.html will be written.