40 JS – document.write – Javascript

Last updated on October 30th, 2020 at 10:48 am.

Watch Full JS Course  here >>

This video is taken from the full course that will teach you HTML, CSS, Programming concepts and Javascript .

Transcript :

In this video, let’s continue with our detour that we started in the last video.

Now in this video, what you want to look at is some ways you can do an output in JavaScript.

Now, in other programming languages you’ll find that there is an I/O mechanism.

So by I/O mechanism I mean there’s a way that the program can ask a user for input and there’s a way that input can be output on the screen for the user.

So for instance in C++, you’ll find that if you want to, if you want to ask a user for input, you’ll just use ‘cin>>’ and then the user will give you some input.

And if you want to output whatever they give you, you’ll just use ‘cout<<’ and then you output whatever it is.

Maybe it’s a variable.

Maybe you’re taking some variable here from the user, so they input that, then you can output this on the screen.

So you see this is a very easy way.

You just know you can use ‘cin>>’ to ask for input from the user.

You can use ‘cout<<’ to output whatever they give you.

And then also in Python there is a similar thing.

You can use ‘input’ to get input from the user and then you can, one way of printing it on the screen you can just say ‘print’ and you’ll print whatever the user gives you.

There is nothing that is directly equivalent to that in JavaScript.

So in JavaScript, if you want to output something, there are different ways you can output things for the user.

And some of them that I have listed here are, you can use this ‘document.write’.

So we are going to talk about, about each of them.

‘document.write’, we have ‘console.log’.

Then, you’ve seen me use the alert.

Then we have the most commonly used which is just manipulating elements on the HTML page.

Now ‘document.write’, this one is used for test, for testing.

So this one, you should only use this one for testing because, the problem with this one, if you use this one, once the entire HTML has been loaded and you use it, it will wipe out the existing HTML.

So whatever you say, ‘document.write’ after the entire HTML has been loaded, that’s what will be written.

You should only use this for testing.

If you’re testing something or you’re doing experiments and you want to do a quick output on the screen.

Let me go to Sublime so that we can see an example of this.

So if I come here, I’ll close the CSS.

We don’t need that.

Now if I come here, I have this ‘document.write’.

So I’ll just comment it out.

And we’re going to do the same thing for each of this.

I’ll just be commenting, and commenting them out and explaining them to you.

Now, let me just remove this.

We don’t need that.

So if I go to the browser and I run this, just see, we expect that, we do expect that this will be added on the HTML that we already have.

So if I run this, you see this has been added for us.

So, as I was saying, the problem with using this, now that the entire HTML has been loaded, if I add some more, if I copy this and then I just add like more HTML to the page, let’s say I want to add something else, just the same line.

So if I run this, it will clear out the entire HTML which is already there.

So, that’s one reason why you should never use the ‘document.write’ on production or at any point where you’re not just doing some tests.

That is one way you can, you can show something on the HTML.

So here you can see I added HTML tags.

So the HTML tags will be passed as HTML and they give this ‘h1’.

That’s why it has the size of an ‘h1’ header tag.

So in this video, we’ve seeing how you can use the ‘document.write’.

So this one you should only use for quick examples.

Maybe you want to test out what is the result of that times that.

So you can use something like this and it will give you the result very fast.

So if I come back and I run this, you’ll see you can use that and it will give you the example down there.

So in this video, we have said that one way that you can show a quick output on the screen on the browser is by using ‘document.write’.

And we’ve said that you should not use it on production.

You should just use it for testing because if you use it, once all HTML is loaded, it will wipe out all the existing HTML.

So in the next video, let’s continue on with the next ways of outputting something on the screen.

So I’ll see you in that next video.

Click the button below to watch this full course: