Javascript and print on the page - javascript

I started to learn javascript and I saw the following code in one of Javascript books:
<!DOCTYPE html>
<html>
<head>
<title>A Simple JavaScript Example</title>
</head>
<body>
<p>Printed before JavaScript is run.</p>
<p>
<script type=”text/javascript”>
document.write(“Printed by JavaScript.”);
</script>
</p>
<p>Printed after JavaScript is run.</p>
</body>
</html>
According to the book, three lines has to be printed. However, when I open this html file in the browser I see only the first and the last lines. The line "Printed by JavaScript" doesn't show.
Do you have any idea what can be the problem?

I guess it's because you used incorrect double quotes (wrong copy-paste from the book sample):
”
should become:
"
so that you have:
<script type="text/javascript">
document.write("Printed by JavaScript.");
</script>

Related

Wordpress: how to use javascript variables into html body

I'm really new in Wordpress, Javascript and HTML so I know this question is really basic, but I wasn't able to find it solved anywhere.
I want to create some variables in javascript and then display them in my page which is created in Wordpress.
Reading other posts I've found I need to insert a javascript code that at the end stores my variable this way (dummy version):
<script type="javascript">
document.getElementById('test').innerHTML = 'hello';
</script>
And then on the text block I want to display my variable to be displayed I should add this code:
<body>
<p id="test"></p>
</body>
However I've tried adding the javascript in the header (Tatsu header) and also tried adding it in the text block (HTML version) in different combinations and it never worked. Tried adding the script block before and after the body block, and also tried having it inside, before and after the display line.
If I try the following it works:
<body>
<p>hello</p>
</body>
So I guess my problem is that I'm not setting the variable properly.
Can anyone help? Apologies if this is already solved somewhere, spent some hours and wasn't able to find it.
Thank you in advance.
Your problem is the type of which you're using here:
<script type="javascript">
I noticed this whilst constructing an example of this problem.
javascript is not a correct mime type.
It should be text/javascript as per https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
Please note this is not a complete list. Such as application/javascript also being valid. Please also see https://www.iana.org/assignments/media-types/media-types.xhtml
Working example:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<p id="test">
This shouldn't show up
</p>
<script type="text/javascript">
console.log("####### JAVASCRIPT IS RUNNING ######")
document.getElementById('test').innerHTML = 'hello';
</script>
</body>
</html>

Client-side Javascript can appear where within an HTML document?

Client-side Javascript can appear where within an HTML document?
A. Between the <head> and </head> tags
B. Between the <body>and </body> tags
C. Both of the above
D. None of the above
Here are codes that are placed in the different parts of the HTML. Ever variation will run no matter where the script tag is placed.
1.
<html>
<head>
<title>Foo</title>
<script type="text/javascript">
alert("hello world");
</script>
</head>
<body>
</body>
</html>
2.
<html>
<head>
<title>Foo</title>
</head>
<body>
<script type="text/javascript">
alert("hello world");
</script>
</body>
</html>
3.
<html>
<head>
<title>Foo</title>
</head>
<body>
</body>
<script type="text/javascript">
alert("hello world");
</script>
</html>
If you try out all these 3 variations where the script tags are placed in different parts of the HTML, you'll see that the alert() call will still run; regardless of their position in the HTML document.
So I think the answer to your question is:
C. Both of the above
Since there is no choice that says "Anywhere within the html document"
It is a good idea to place scripts at the bottom of the element.
This can improve page load, because HTML display is not blocked by scripts loading.
You should prefer here:
I chose "C" both of the above because the "Script" can be placed anywhere between the and < / body> as well as the < head> and < / head> It appears the most logical answer to go with in this situation is "C"

my console.log does not work in my html page

I am very new to javascript but I can't go forward in learning because my console.log doesn't work AT ALL I will type in the console.log message and on my html page nothing shows up. i have try to debug it but I'm so new I don't know how all I can do is go to the forums and ask, it seem some people have the problem but, there is no good answer to the problem. I've tried every thing i know how to do (which isn't very much) but nothing works PLEASE HELP!!
this is my program
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script type="text/javascript">
console.log("Hello World!"</script>
</body>
</html>
i know that it has to be in dev tool to see it now but how do i make it show up in the html not in dev.?
there has to be a way!
i now now that document.write is the right way but that isn't working either
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script>
var name = "Nicholas";
document.write("Hello " + name);
if (name.length > 7 {
document.write("Wow you have a Really Long name!");
}
</script>
</body>
</html>
Technically, console.log is not supposed to show up on your HTML page. Rather, it shows up on your console's (web browser) log.
Even with all the correct answers provided, you can view your answer by visiting the Developer Tool -> Console (For Chrome, on Apple, it's Option + Command + J). For Windows, using Chrome, you hold the following keys: Ctrl+Shift+J
Here is a clip of the code and the log recorded by the console:
because you have to type console.log()
not control.log
Also, console.log needs to be either inside script tags, or in a separate javascript file. In your case you would have to do:
console.log("Hello, World!");
Try the below sample
<html>
<head>
<script type="text/javascript">
console.log("Hello World")
</script>
</head>
<body>
Hello
</body>
</html>
Unless you typed/edited your post.. that has an invalid Javascript.
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script type="text/javascript">
console.log("Hello World!");
</script>
</body>
</html>
You did not have a closing )
Ah, as others have explained.. Console is not your HTML page, its part of the web browser itself. For example, in google chrome press CTRL+SHIFT+J to show it.
Your after document.write

HTML/Javascript Confusion

I have an extremely basic html document written as the following:
<html>
<head>
<title>A Basic Javascript Game</title>
</head>
<body>
<script language="JavaScript" src="mygame.js">
</script>
</body>
</html>
I've created an according Javascript file, have made sure that it's syntax is alright. The first line of the mygame.js file is:
var persontotalkto = prompt("You wake up one Saturday morning. The Holidays just started, and you can't wait to tell your family where you've decided for all of us to go on vacation! Who do you talk to: WIFE, SON, or DAUGHTER?").toUpperCase();
But when I open the html file, I'm not getting any prompt whatsoever. I have javascript enabled, so what is the problem?
Change the script tag to either the HTML4 version:
<script type="text/javascript" src="mygame.js"></script>
Or the HTML5
<script src="mygame.js"></script>
(Either will work on any browser released this millennium.)
Change
<script language="JavaScript" src="mygame.js">
</script>
to
<script type="text/javascript" src="mygame.js">
</script>

Javascript Alert not displaying

I am working from the book "Simply JavaScript" and there is an example on pages 68-69 that I cannot get to run. I have copied it from the book and I am working with a fellow student. I think there must be a coding error in the example and was hoping someone could look it over real quick and give us some guidance.
From what I understand the script should cause an alert box to pop up and display the node name (which according to the book should just be a)
Here is the HTML
<!doctype html>
<head>
<script type="text/javascript" src="script.js"></script>
<meta charset="utf-8">
<title>
Stupid Title
</title>
</head>
<body>
<h1>
Sniper (1998)
</h1>
<p>
In this cinema masterpiece
<a id ="berenger" href="name/nm0000297/">tom Berenger</a> plays a us soldier working in the Panamanian Jungle.
</p>
</body>
And here is my JavaScript
alert("AAAAAAAAAAAAAAHH");
var target = document.getElementById("berenger");
if (target != null)
alert(target.nodeName);
This is my second week of javascript class so I'm pretty new with it.
The DOM isn't ready at this point:
<script type="text/javascript" src="script.js"></script>
Move that line to the end of <body>
Read about those kind of issues in this docs

Categories