Javascript
Confirm Box used for displaying message with 2 buttons "OK" and "Cancel". This popup used for asking confirmation.
Prompt Box is also display popup with 2 buttons and one textfield like below image.
I have created one function with single statement alert. If you run the page in the browser, you don’t get the alert because function not called anywhere in javascript.
Javascript designed to add interactivity to html pages. Javascript is a scripting language.A scripting language is a lightweight programming language.
Client Side Scripting:
The client is the system on which the web browser is running. Javascript is the main client side scripting language.
Client
side scripting interpreted by browser. When the user request to the web
page from the server. Server search the page and return the result back
to client means user. In this process scripting is also running while
loading page or after displaying page.
See in the below html code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
alert("Welcome to Client side scripting world")
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
alert("Welcome to Client side scripting world")
</script>
</body>
</html>
I have taken simple html page. And added script tag on the page. In that just added single statement. And see what happen after running this page on browser.
The word alert is a standard javascript command that will cause an alert box to popup on the screen.
By entering the alert command between the <script type="text/javascript"> and </script>
tags, browser will recognize it as javascript command. In general, you
can put javascript command in head and body tags.
There are 3 popup boxes in Javascript
- Alert box
- Confirm Box
- Prompt Box
Confirm Box used for displaying message with 2 buttons "OK" and "Cancel". This popup used for asking confirmation.
Prompt Box is also display popup with 2 buttons and one textfield like below image.
And the syntax for this is
prompt("Your Text","Default Value")
Variables in Javascripts:
Like many programming languages, Javascript has variables.Before you use the variables in the program, you must have to declare it first.
You can declare the variables using "var" keyword.
<script type="text/javascript">
var i = 10;
</script>
var i = 10;
</script>
Arithmetic Operators:
Below are some arithmetic operators
- ++ for increment
Example:
<script type="text/javascript">
var i = 10;
i++;
alert(i); // I will be 11 now.
</script>
var i = 10;
i++;
alert(i); // I will be 11 now.
</script>
- -- for decrement
This operator decrement the value by 1
- % for modulus
This operator return what is left when 2 numbers are divided.
Comparing Operator:
- == for equal to
- != for not equal to
- < for less than
- > for greater than
- <= for less than equal to
- >= for greater than equal to
Functions In Javascript
Javascript return in functions will not be performed until you specifically ask for it.
Look in the below code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function myfunction()
{
alert("Javascript scripting language");
}
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function myfunction()
{
alert("Javascript scripting language");
}
</script>
</body>
</html>
I have created one function with single statement alert. If you run the page in the browser, you don’t get the alert because function not called anywhere in javascript.
Events in javascript
First understand, what is mean by event.
"Event is the action that is detected by the javascript."
Example of that is onmouseover event, which is detected when user moves the mouse over an object.
Another example of event is that onload event, which is detected as soon as page finished loading.
Below are the some events.
- onfocus
Detected when for field get focused.
- onblur
Detected when form field loses focus.
- onchange
Detected when content of the field changes.
- onselect
Detected when text is selected
- onmouseover
Detected when mouse moves over an object.
- onmouseout
Detected when mouse moves out an object
- onclick
Detected when mouse click fires on object
- onload
Detected when page is finished loading
- onunload
Detected when browser open new document
- Onsubmit
Detected when submit button is clicked
See below example of click event example
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<input id="Button1" type="button" value="button" onclick="myfunction()"/>
<script type="text/javascript">
function myfunction()
{
alert("Javascript scripting language");
}
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<input id="Button1" type="button" value="button" onclick="myfunction()"/>
<script type="text/javascript">
function myfunction()
{
alert("Javascript scripting language");
}
</script>
</body>
</html>
Just I added click event on button and on click of that event called function of javascript. See below output when you click on button.
0 Comments