Jquery Javascript



Jquery uses lot of Javascript to simplify the problems that javascript was having . JavaScript is a web based scripting language and it was designed to add interactivity to HTML pages. The scripting language is a lightweight programming language. JavaScript usually embedded directly into HTML pages. JavaScript is an interpreted language. It means that this type of script execute without preliminary compilation. JavaScript is free. We can use it without purchasing a license. JavaScript is easy to learn. JavaScript is used to add functionality, validate forms, communicate with the server etc. JavaScript do the following operations.
  1. JavaScript gives HTML designers a programming tool: – HTML authors are normally not programmers, but JavaScript is a scripting language with a very simple syntax! Almost anyone can put small “snippets” of code into their HTML pages
  2. JavaScript can react to events:- A JavaScript can be set to execute when something happens, like when a page has finished loading or when a user clicks on an HTML element
  3. JavaScript can manipulate HTML element:- A JavaScript can read and change the content of an HTML element
  4. JavaScript can be used to validate data:- A JavaScript can be used to validate form input
  5. JavaScript can be used to detect the visitor’s browser:- A JavaScript can be used to detect the visitor’s browser, and – depending on the browser:- Load another page specifically designed for that browser
  6. JavaScript can be used to create cookies:- A JavaScript can be used to store and retrieve information on the visitor’s computer
Eg: –
<!DOCTYPE html>
<html>
<head>
<script type=”text/javascript”>
function displayDate()
{
document.getElementById(“demo”).innerHTML=Date();
}
</script>
</head>
<body>
<h1>My First Web Page</h1>
<p id=”demo”> This is a paragraph.</p>
<button type=”button” onclick=”displayDate()”>Display Date</button>
</body>
</html>
1) Manipulating HTML elements
The HTML <script> tag is used to insert javaScript into an HTML document. The HTML “id” attributes is used to determine HTML elements. For extracting HTML element from a javaScript we use the document.getElementById() method.
Eg: –
<!DOCTYPE html>
<html>
<body>
<h1> My First Web Page</h1>
<p id=”demo”> My First Paragraph</p>
<script type=”text/javascript”>
document.getElementById(“demo”).innerHTML=”My First JavaScript”;
</script>
</body>
</html>
2) Write directly into the HTML document
Here we are using the write() for writing something directly into the HTML document.
Eg: –
<!DOCTYPE html>
<html>
<body>
<h1> My First Web Page</h1>
<script type=”text/javascript”>
document.write(“<p>My First JavaScript</p>”);
</script>
</body>
</html>
3) JavaScript functions and events
If we want to execute a JavaScript when an event occurs, like when a user clicks a button. In this situation we put the script inside a function. Normally functions are the combination of events.
Eg: –
<!DOCTYPE html>
<html>
<head>
<script type=”text/javascript”>
function myFunction()
{
document.getElementById(“demo”).innerHTML=”My First JavaScript Function”;
}
</script>
</head>
<body>
<h1> My Web Page</h1>
<p id=”demo”> A Paragraph</p>
<button type=”button” onclick=”myFunction()”>Try it</button>
</body>
</html>
JavaScript Functions in <body>
Eg: –
<!DOCTYPE html>
<html>
<body>
<h1> My Web Page</h1>
<p id=”demo”> A Paragraph</p>
<button type=”button” onclick=”myFunction()”>Try it</button>
<script type=”text/javascript”>
function myFunction()
{
document.getElementById(“demo”).innerHTML=”My First JavaScript Function”;
}
</script>
</body>
</html>
4) Using an external javaScript
We can place javaScript in external files. This external file includes code to be used on several different web pages. The external javaScript files have the file extension .js. The external script cannot includes the <script> </script> tags. To use an external script it point to the .js file in the “src” attribute of the <script> tag.
Eg:-
<!DOCTYPE html>
<html>
<body>
<script type=”text/javascript” src=”myScript.js”>
</script>
</body>
</html>
Hope that these samples of jquery javascript might have helped you to solve some of your issues with javascript.

No comments:

Post a Comment