WEB DESIGN TUTORIAL HTML THE OF PART-024 FULL WEB DESIGN HTML
At first, Thank for my all Post Readers. Today HTML Full parts 22 post.( Full Web design tutorial To Html ) This is Full HTML Web Page in the Tutorial. you can learn a full HTML web design it. I hope so. Let's start...
Today's Subject is HTML Javascript
HTML Javascript
A script is a small piece of program that can add interactivity to your website.
For example, a script could generate a pop-up alert box message, or provide
a drop down menu. This script could be written using Javascript or VBScript.
You can write various small functions, called event handlers, using any of the
scripting language and then you can trigger those functions using HTML
attributes.
Now a days only Javascript and associated frameworks are being used by
most of the web developers, VBScript is not even supported by various major
browsers.
You can keep Javascript code in a separate file and then include it where ever
it’s needed, or you can define functionality inside HTML document itself. Let's
see both the cases one by one with suitable examples.
External Javascript
If you are going to define a functionality which will be used in various HTML
documents then it’s better to keep that functionality in a separate Javascript
file and then include that file in your HTML documents. A Javascript file will
have extension as .js and it will be included in HTML files using <script> tag.
Example
Consider we define a small function using Javascript in script.js which has
following code:
function Hello()
{
alert("Hello, World");
}
Now
let's make use of the above external Javascript file in our following HTML
document:
<!DOCTYPE html>
<html>
<head>
<title>Javascript External Script</title>
<script src="/html/script.js" type="text/javascript"/></script>
</head>
<body>
<input type="button" onclick="Hello();" name="ok" value="Click Me" />
</body>
</html>
This will produce following result.
Example:
When you will click the button, you will get the following result. Press The Botton :
Internal Script
You can write your script code directly into your HTML document. Usually we
keep script code in header of the document using <script> tag, otherwise there
is no restriction and you can put your source code anywhere in the document
but inside <script> tag.
Example
Example:
some older browsers don't. If a browser doesn't support JavaScript, instead
of running your script, it would display the code to the user. To prevent this,
you can simply place HTML comments around the script as shown below.
JavaScript Example:
<script type="text/javascript">
<!--
document.write("Hello Javascript!");
//-->
</script>
VBScript Example:
<script type="text/vbscript">
<!--
document.write("Hello VBScript!")
'-->
</script>
The <noscript> Element
You can also provide alternative info to the users whose browsers don't
support scripts and for those users who have disabled script option their
browsers. You can do this using the <noscript> tag.
JavaScript Example:
<script type="text/javascript">
<!--
document.write("Hello Javascript!");
//-->
</script>
<noscript>Your browser does not support Javascript!</noscript>
VBScript Example:
<script type="text/vbscript">
<!--
document.write("Hello VBScript!")
'-->
</script>
<noscript>Your browser does not support VBScript!</noscript>
ultimately using multiple <script> tags. You can specify a default scripting
language for all your script tags. This saves you from specifying the language
every time you use a script tag within the page. Below is the example:
<meta http-equiv="Content-Script-Type" content="text/JavaScript" />
Note that you can still override the default by specifying a language within the
script tag.
Example:
When you will click the button, you will get the following result. Press The Botton :
Internal Script
You can write your script code directly into your HTML document. Usually we
keep script code in header of the document using <script> tag, otherwise there
is no restriction and you can put your source code anywhere in the document
but inside <script> tag.
Example
<!DOCTYPE html>
<html>
<head>
<title>Javascript Internal Script</title>
<base href="http://www.tutorialspoint.com/" />
<script type="text/javascript">
function Hello(){
alert("Hello, World");
}
</script>
</head>
<body>
<input type="button" onclick="Hello();" name="ok" value="Click Me" />
</body>
</html>
Example:
Related Post: WEB DESIGN TUTORIAL HTML THE OF PART-023 FULL WEB DESIGN HTML
Hide Scripts from Older Browsers
Although most (if not all) browsers these days support Javascript, but stillsome older browsers don't. If a browser doesn't support JavaScript, instead
of running your script, it would display the code to the user. To prevent this,
you can simply place HTML comments around the script as shown below.
JavaScript Example:
<script type="text/javascript">
<!--
document.write("Hello Javascript!");
//-->
</script>
VBScript Example:
<script type="text/vbscript">
<!--
document.write("Hello VBScript!")
'-->
</script>
The <noscript> Element
You can also provide alternative info to the users whose browsers don't
support scripts and for those users who have disabled script option their
browsers. You can do this using the <noscript> tag.
JavaScript Example:
<script type="text/javascript">
<!--
document.write("Hello Javascript!");
//-->
</script>
<noscript>Your browser does not support Javascript!</noscript>
VBScript Example:
<script type="text/vbscript">
<!--
document.write("Hello VBScript!")
'-->
</script>
<noscript>Your browser does not support VBScript!</noscript>
Default Scripting Language
There may be a situation when you will include multiple script files andultimately using multiple <script> tags. You can specify a default scripting
language for all your script tags. This saves you from specifying the language
every time you use a script tag within the page. Below is the example:
<meta http-equiv="Content-Script-Type" content="text/JavaScript" />
Note that you can still override the default by specifying a language within the
script tag.
