Scribd
Upload
16 views

2-JavaScript How To

The document explains how to insert JavaScript into HTML pages using the <script> tag. It demonstrates how to write content to HTML elements using document.write() and getElementById().innerHTML. It also notes that some browsers may not support JavaScript, so the HTML comment tags <!-- --> should be used to hide the JavaScript from those browsers.

Uploaded by

powerndf_10
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
16 views

2-JavaScript How To

The document explains how to insert JavaScript into HTML pages using the <script> tag. It demonstrates how to write content to HTML elements using document.write() and getElementById().innerHTML. It also notes that some browsers may not support JavaScript, so the HTML comment tags <!-- --> should be used to hide the JavaScript from those browsers.

Uploaded by

powerndf_10
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

JavaScript How To

http://www.w3schools.com/js/js_howto.asp

TRANSLATE

HOME

HTML

CSS

XML

JAVASCRIPT

ASP

PHP

SQL

MORE...

REFERENCES

| EXAMPLES

| FORUM | ABOUT

TOP 100: Free Website Templates Free CSS Templates Free HTML Templates Free Web Templates

JS Basic
JS HOME JS Introduction JS How To JS Where To JS Statements JS Comments JS Variables JS Operators JS Comparisons JS If...Else JS Switch JS Popup Boxes JS Functions JS For Loop JS While Loop JS Break Loops JS For...In JS Events JS Try...Catch JS Throw JS Special Text JS Guidelines

JavaScript How To
Previous Next Chapter
The HTML <script> tag is used to insert a JavaScript into an HTML page.

WEB HOSTING Best Web Hosting PHP MySQL Hosting Best Hosting Coupons UK Reseller Hosting Cloud Hosting

Writing to The HTML Document


The example below writes a <p> element with current date information to the HTML document:

Top Web Hosting $3.98 Unlimited Hosting Premium Website Design WEB BUILDING Download XML Editor FREE Website BUILDER Free Website Templates Free CSS Templates CREATE HTML Websites W3SCHOOLS EXAMS Get Certified in: HTML, CSS, JavaScript, XML, PHP, and ASP W3SCHOOLS BOOKS

Example
<html> <body> <h1>My First Web Page</h1> <script type="text/javascript"> document.write("<p>" + Date() + "</p>"); </script> </body> </html>
Try it yourself

JS Objects
JS JS JS JS JS JS JS Objects Intro String Date Array Boolean Math RegExp

Note: Try to avoid using document.write() in real life JavaScript code. The entire HTML page will be overwritten if document.write() is used inside a function, or after the page is loaded. However, document.write() is an easy way to demonstrate JavaScript output in a tutorial.

New Books: HTML, CSS JavaScript, and Ajax STATISTICS Browser Statistics Browser OS Browser Display SHARE THIS PAGE Share with

JS Advanced
JS JS JS JS JS JS Browser Cookies Validation Timing Create Object Summary

Changing HTML Elements


The example below writes the current date into an existing <p> element:

Example
<html> <body> <h1>My First Web Page</h1> <p id="demo"></p> <script type="text/javascript"> document.getElementById("demo").innerHTML=Date(); </script> </body> </html>
Try it yourself

JS Examples
JS JS JS JS JS JS Examples Objects Examples Browser Examples DOM Examples Quiz Certificate

SEO-Friendly Content Easy


User generated Q&A content gives you growing organic traffic
www.answerbase.co

JS References
JavaScript Objects HTML DOM Objects

Extrusion Automatation
Advanced controls and automation for aluminium extrusion plant.
www.kellysystems.c

Note: To manipulate HTML elements JavaScript uses the DOM method getElementById(). This method accesses the element with the specified id.

Examples Explained
To insert a JavaScript into an HTML page, use the <script> tag. Inside the <script> tag use the type attribute to define the scripting language. The <script> and </script> tells where the JavaScript starts and ends: Frenzelit
fabric, elastomer, rubber, PTFE and metall expansion joints
www.frenzelit.com

<html> <body> <h1>My First Web Page</h1>


PimpLib.com

<p id="demo">This is a paragraph.</p> <script type="text/javascript"> ... some JavaScript code ... </script> </body> </html>
The lines between the <script> and </script> contain the JavaScript and are executed by the browser.

Find and share your dev libraries and frameworks with friends.
pimplib.com

1 of 2

01/04/2012 2:29 PM

JavaScript How To

http://www.w3schools.com/js/js_howto.asp

In this case the browser will replace the content of the HTML element with id="demo", with the current date:

<html> <body> <h1>My First Web Page</h1> <p id="demo">This is a paragraph.</p> <script type="text/javascript"> document.getElementById("demo").innerHTML=Date(); </script> </body> </html>
Without the <script> tag(s), the browser will treat "document.getElementById("demo").innerHTML=Date();" as pure text and just write it to the page: Try it yourself

Some Browsers do Not Support JavaScript


Browsers that do not support JavaScript, will display JavaScript as page content. To prevent them from doing this, and as a part of the JavaScript standard, the HTML comment tag should be used to "hide" the JavaScript. Just add an HTML comment tag <!-- before the first JavaScript statement, and a --> (end of comment) after the last JavaScript statement, like this:

<html> <body> <script type="text/javascript"> <!-document.getElementById("demo").innerHTML=Date(); //--> </script> </body> </html>


The two forward slashes at the end of comment line (//) is the JavaScript comment symbol. This prevents JavaScript from executing the --> tag.

Previous

Next Chapter

Build Your Professional HTML Website with Wix


Start building your own beautiful HTML website. Its easy and free! Wix.com provides an easy-to-use online platform where you can create and publish your own HTML website. Enjoy powerful drag & drop editing tools & stunning customizable website designs. With total design control, eCommerce features and superior SEO results, Wix is the ultimate solution for creating an exquisite HTML website while saving tons of money. Start now!

www.lumosity.com

Ads by Google

REPORT

ERROR

HOME

TOP

PRINT

FORUM

ABOUT

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use and privacy policy. Copyright 1999-2012 by Refsnes Data. All Rights Reserved.

2 of 2

01/04/2012 2:29 PM

You might also like