Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Js ppt

25,629 views

Published on

Published in: Technology

Js ppt

  1. 1. JAVASCRIPT What is JavaScript? JavaScript is a programming language designed for Web pages
  2. 2. History  First web scripting language  Developed by Netscape and Sun  Initiated by Netscape and called LiveScript  In parallel with this, Sun was developing Java
  3. 3. Why Use JavaScript? • JavaScript enhances Web pages with dynamic and interactive features. • JavaScript runs in client software. • JavaScript 1.3 works with version 4.0 browsers.
  4. 4. What can a JavaScript Do?  JavaScript gives HTML designers a programming tool.  JavaScript can react to events.  Validate data.  It can be used to detect the visitor's browser  Create cookies.  Read/write/modify HTML elements
  5. 5. JavaScript Terminology. JavaScript programming uses specialized terminology. Understanding JavaScript terms is fundamental to understanding the script. Objects, Properties, Methods, Events, Functions, Values, Variables, Expressions, Operators.
  6. 6. Objects  Objects refers to windows, documents, images, tables, forms, buttons or links, etc.  Objects should be named.  Objects have properties that act as modifiers.
  7. 7. Client-Side Script  When client makes the request, the HTML and all scripts will be downloaded into your browser and then the resultant HTML will be displayed in the browser is called client-side script. Example: JavaScript, VB-Script etc.
  8. 8. JavaScript Statements <html> <head><title>My Page</title></head> <body> <script language="JavaScript"> document.write('This is my first → JavaScript Page'); </script> </body> </html> Note the symbol for line continuation
  9. 9. Naming Form Elements in HTML <form name="addressform"> Name: <input name="yourname"><br /> Phone: <input name="phone"><br /> Email: <input name="email"><br /> </form>
  10. 10. Forms and JavaScript document.formname.elementname.value Thus: document.addressform.yourname.value document.addressform.phone.value document.addressform.email.value
  11. 11. Objects Objects refers to windows, documents, images, tables, forms, buttons or links, etc. Objects should be named. Objects have properties that act as modifiers.
  12. 12. Properties Properties are object attributes. Object properties are defined by using the object's name, a period, and the property name. e.g., background color is expressed by: document.bgcolor . document is the object. bgcolor is the property.
  13. 13. Methods Methods are actions applied to particular objects. Methods are what objects can do. e.g., document.write(”Hello World") document is the object. write is the method.
  14. 14. Functions Functions are named statements that performs tasks. e.g., function doWhatever () {statement here} The curly braces contain the statements of the function. JavaScript has built-in functions, and you can write your own.
  15. 15. Values Values are bits of information. Values types and some examples include: Number: 1, 2, 3, etc. String: characters enclosed in quotes. Boolean: true or false. Object: image, form Function: validate, doWhatever
  16. 16. Variables Variables contain values and use the equal sign to specify their value. Variables are created by declaration using the var command with or without an initial value state. e.g. var month; e.g. var month = April;
  17. 17. The HTML DOM (Document Object Model)
  18. 18. Finding HTML Elements Finding HTML Elements by Id : Example: var x=document.getElementById("intro"); Finding HTML Elements by Tag Name: Example: var x=document.getElementById("main"); var y=x.getElementsByTagName("p");
  19. 19. Using Separate JavaScript Files. Linking can be advantageous if many pages use the same script. Use the source element to link to the script file. <script src="myjavascript.js” language="JavaScript1.2” type="text/javascript"> </script>
  20. 20. JavaScript RegExp Object var dob_regex = /^([0-9]){2}(/){1}([0-9]){2}(/)([0-9]){4}$/; //DD/MM/YYYY var email_regex = /^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+.)+[a-zA-Z0-9.-]{2,4}$/; // email address var username_regex = /^[w.-]+$/; // allowed characters: any word . -, ( w ) represents any word character (letters, digits, and the underscore _ ), equivalent to [a-zA-Z0-9_] var num_regex = /^d+$/; // numeric digits only var password_regex = /^[A-Za-zd]{6,8}$/; // any upper/lowercase characters and digits, between 6 to 8 characters in total var phone_regex = /^(d{3]) d{3}-d{4}$/; // (xxx) xxx-xxxx

×