Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I am new to programming and going through a "Beginning Programming" book. It lists the following code to write basic lines on a website:
<!DOCTYPE html>
<html>
<body>
<h1>This is a Test</h1>
<script>
document.write("<p>I like to code</p>");
document.write("<p>I will succeed at coding</p>");
</script>
</body>
</html>
Unfortunately, the line
document.write("<p>I like to code</p>");
does not give the desired output of "I like to code" written on the website.
How should this be written to get this output?
Your code seems to be running fine. Try updating your HTML file to this:
<!DOCTYPE html>
<html>
<body>
<h1>This is a Test</h1>
<script>
document.write("<p>I like to code</p>");
document.write("<p>I will succeed at coding</p>");
</script>
<noscript>
Javascript is disabled!
</noscript>
</body>
</html>
and if you see "Javascript is disabled!" then you'll need to allow your browser to use javascript.
Good luck :)
<!DOCTYPE html>
<html>
<body>
<h1>This is a Test</h1>
<script>
document.write("<p>I like to code</p>");
document.write("<p>I will succeed at coding</p>");
</script>
</body>
</html>
Seems to be running fine. Copy pasted same code
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 1 year ago.
Improve this question
I'm struggling to get javascript file linked to HMTL. I've made sure that the HTML & javascript file are saved as 'index.html' & 'script.js', and saved them in the same folder. But when trying to access the html file in Chrome, the javascript doesn't appear, either in Console of the Dev Tool.
Please see below the code I'm writing in Sublime Text. Could you please advise me what I'm doing wrong here? Thanks a lot !
<!DOCTYPE html> <html>
<head>
<title>JavaScript</title>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
<h1>Javascript in HTML</h1>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
Going off the comments, the code console.log("hello"); will display "hello" in the console of your browser, not in the body of your HTML page. This is often accessed by tapping the F12 key.
If you want your text to show up in the HTML, you need to give it an HTML element for the text to be displayed, then use JavaScript to find the element and update the text.
document.getElementById("textGoesHere").innerText = "hello";
<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
<link rel="stylesheet" type="text/css" href="#">
<script src="script.js"></script>
</head>
<body>
<h1>Javascript in HTML</h1>
<div id="textGoesHere" />
</body>
</html>
The caveat to that is you can't run the JavaScript correctly until the HTML is generated, so declaring it in the HEAD tag, like people tend to do, you need to put the JavaScript in a method, then call that method from the BODY event of onload.
<body onload="UpdateText()">
function UpdateText()
{
document.getElementById("textGoesHere").innerText = "hello";
}
Since this is fairly basic JavaScript and HTML, I'm going to suggest you use a tutorial to get started programming, such as:
https://www.codecademy.com/learn/introduction-to-javascript
It's much easier to learn the basics from a course than try to stumble your way through, trying to learn piecemeal by banging your head on everything. I have some experience in doing both. Believe me, a tutorial/class is less painful. ;-)
try out this
<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
<link rel="stylesheet" type="text/css" href="#">
</head>
<body>
<h1>Javascript in HTML</h1>
<script src="script.js"></script>
</body>
</html>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I cant get my external file to work. I just want a simple alert, it works in my main html file but not when I link the external js file.
<!doctype html>
<html>
<head>
<title>Javascript Tutorial</title>
</head>
<body>
<div class="container">
<h1>Let's Learn Javascript!</h1>
<p class="lead">...cause Javascript Rocks.</p>
</div>
<script src="scripts/main.js"></script>
</body>
</html>
It is proper practice to define script tags in the <head> or <footer> tag. Also when linking to your Javascript file the methods in the file won't be called automatically unless you use document.ready.
If you wish for a function to be called as soon as the page loads use document.ready or create a script tag in the <head> or <footer> and call the function from there:
<script type="text/javascript">
myfunction();
</script>
Also in the JS file code shouldn't just be laying about, they should be organized/enclosed in functions.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
This is a small exercise in W3Schools that I wanted to try in my browser. The toggle animation did not work when I set the files separately, but it worked when I put the script within the HTML. Am I linking up the files wrong when they are separate? I also tried placing the script between the <head> tags, and that didn't work either.
HTML:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"type="text/css"href="main.css"/>
</head>
<body>
<div class="container" onclick="myFunction(x)">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<script type="text/javascript"src="script.js"></script>
</body>
</html>
JS:
function myFunction(x){
x.classList.toggle("change")
}
Thank you!
The tag
<script type="text/javascript"src="script.js"></script>
should suffice IF you saved the Javascript file as "script.js" in the same folder as your HTML file.
Also notice that the following line doesn't have a context for x:
<div class="container" onclick="myFunction(x)">
Maybe you are trying to do something like:
<div class="container" onclick="myFunction(this)">
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I've noticed that on the first load of some of the pages on my site, there's a quick white flash.
It doesn't seem to do this once the page content has been cached, but it's annoying during the first loads.
I tried styling all of the <html> tags black, but that doesn't seem to solve the issue. Could it be the scripts on some of my pages? (i.e. maybe analytics)
Is there anything I could do to remedy this problem?
Update: The site can be viewed here. Some pages have Javascript, but others do not, and it seems that's irrelevant, based on the results I've experienced.
OK, so it looks like this might be related to your script tag in the <head/>. Try pushing that down to just before the closing </body> tag. The document can't render until that script has completely run.
See rule 6
However, one of the other resource you're waiting on sometimes is 'home.css'. That may even be more of a problem. It's a bit of a hack, but you could try setting your background to black before even that css using an inline <style/> tag.
Try structuring the page in this order (notice the <style/>) tag;
<!doctype html>
<html>
<head>
<style>
html { background-color: black; }
</style>
...
<link href="home.css" rel="stylesheet" type="text/css">
...
</head>
<body>
...
<div id="footer">
<span class="footer_text">Copyright © 2013 Casey Kidd Music.<br />All Rights Reserved.</span>
</div>
</div>
<script>
(function(
...
'pageview');
</script>
</body>
</html>
It's possible you may still get a small flicker of white between pages, before the HTML has loaded, but this window would be pretty small now.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I have my "good.html" and "jquery.js" file in a folder on desktop called "jquery2."
Here is my code
<!doctype html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
console.log('ready');
});
</script>
</body>
</html>
Your
<script type="text/javascript" src="jquery.js"></script>
is not referencing the file on your desktop.
In order to make this work, you should upload the files to a server.
You don't need a server but you do need to use a good path to the javascript file on your desktop, on windows like so:
<script type="text/javascript" src="C:\Users\username\Desktop\jquery2\jquery.js"></script>
works for me on windows 7 with chrome browser. console shows ready.
If I make the path bad, console shows "Uncaught ReferenceError: $ is not defined" followed by a red X box next to
GET file:///C:/Users/wrongusername/Desktop/jquery2/jquery.js
Its issue with your Javascript path... put on same folder of your code or
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
more info
Where do you include the jQuery library from? Google JSAPI? CDN?
<script type="text/javascript">
$(document).ready(function(){
alert('ready');
});
</script>