Why a simple <script src="..."> </script> doesn't work? - javascript

I'm working on a project, and I didn't understand why a call to external script doesn't work.
Then I just did a extremely simple page html which includes a script alert, as you can see below... Can you tell me what's the problem ? I believe the problem is not the code, but what else can it be?
My browser is a recent Chrome, and my OS is Ubuntu.
My HTML file is index.html :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>MyPage</title>
</head>
<body>
<p>Blablabla</p>
<script type="text/javascript" src="/script.js"></script>
</body>
</html>
The Javascript file is script.js in the same folder:
<script type="text/javascript">
alert('Hey');
</script>

Paths starting with / are absolute paths. If the script and the HTML page are in the same directory, the script's path is simply "script.js":
<script type="text/javascript" src="script.js"></script>
<!-- Here --------------------------^ -->

If the file is in the same folder remove the "/" from script.js
<script type="text/javascript" src="script.js"></script>
Also if the js file has the script tags remove them.
If you want the alert when the doc is ready, consider doing something like:
document.addEventListener("DOMContentLoaded", function(event) {
alert('Hey')
});

I think that the script in the file dosen't need this script tag
<script type="text/javascript">
alert('Hey');
</script>
you can make like this
alert('hey');
just that try out and check if the file path in html to the js file is the right one.

Hi you don't need the script tags in the file:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>MyPage</title>
</head>
<body>
<p>Blablabla</p>
<script type="text/javascript" src="/script.js"></script>
</body>
</html>
The Javascript file is script.js in the same folder:
alert('Hey');

I have solve this problem by using Visual Studio. Just open the html file in VS and then run this file from here. It will connect your js file to html.

Related

Visual studio not recognizing src attribute when trying to refer to the index.js file

I am writing my javascript code in the file "index.js". When I use the src attribute in the "index.html" file it is not working. I am using visual basic editor.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script> src="index.js" </script>
</body>
</html>
When I run live server I would like for it to execute the code in both files.
When using the <script> tag, you should use the src as an attribute, not Html Content.
So instead of doing:
<script> src="index.js" </script>
You should do:
<script src="index.js"></script>
To learn more about attributes, I highly suggest looking it up on sites such as w3schools.
As SLasks mentioned in the comment, srcis an attribute not a content meaning your scripttag should like this:
<script src="index.js"> </script>

.sh add html5 template to created file

I am in the process of creating a shell script .sh.
I now need to create a html file and add the html of a whole html5 template and same it.
So...
sh myshfile.sh
touch index.html
...Add the html of a html5 template
For example...create a html file and add this:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/styles.css?v=1.0">
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="js/scripts.js"></script>
</body>
</html>
...via a shell script.
How do I do this?
You could use one of the following methods.
If the content of the template is stored in a file,
cat template.html > index.html
If the content is to be stored in the script itself then,
echo "<html><h1>This is a test</h1></html>" > index.html
Don't forget to escape the quotes with \"

Where to load script tags in Vue?

I am new to Vue.js and I am simply trying to load script tags to the page, like jQuery for example. I tried adding the scripts to the end of the body in the index.html file, but they come back as 404s.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>title</title>
</head>
<body>
<div id="app"></div>
<!-- JQUERY -->
<script src="assets/js/jquery-2.1.4.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.matchHeight/0.7.0/jquery.matchHeight-min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/tipr.min.js"></script>
</body>
</html>
Try moving them to the /static/ folder &/or prefixing the paths with ./ or /

Javascript files not loading for page

I have a fairly simple HTML file:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>deploy.rb</title>
<script src="test.js" type="text/javascript"></script>
<script src="OtherScript.js" type="text/javascript"></script>
<link rel="stylesheet" href="style.css">
</head>
<body>
body
</body>
</html>
test.js looks like this:
window.onload = function () { alert("It's loaded!") }
Can someone tell me why I don't get an alert when the page loads? (and why none of the functions in OtherScript.js are executing)
The full contents of the html file can be found here, if it helps.
I'm an idiot. OtherScript.js also used window.onload. I consolidated both scripts into the same file, and now it works file.
you might check the directory structure. The code looks fine to me, so if I had to guess the .js files are not being found correctly. If they're in the same directory as the HTML file you might try appending ./ to the beginning of the filename.

JQUERY not calling ready - JavascriptResources in eclipse

I have added jQuery Library 2.1 as javascriptResource in the project. As shown in the picture.
In the index.html, the autocomplete for ready works but, ready function is not called.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert("Hello");
});
</script>
</head>
<body>
What could I be missing?
Having it available under JavaScript Resources makes it known to the tools, and available for Content Assist at edit-time. It doesn't change the behavior at runtime in the browser--something still has to reference the jQuery file from your web page, like a script tag.
Try to include the jquery script. Example:
<head>
<script src="jquery-1.11.2.min.js"></script>
</head>
Source : http://www.w3schools.com/jquery/jquery_get_started.asp
Hope it helps.

Categories