1 / 33

Java Script

Java Script. Dvijesh B hatt. Web Page. HTML defines Web sites content through semantic tags (headings, paragraphs, lists, …). CSS defines 'rules' or 'styles' for presenting every aspect of an HTML document Font (family, size, color, weight, etc.) Background (color, image, position, repeat)

deirdre-wilson
Télécharger la présentation

Java Script

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Java Script DvijeshBhatt

  2. Web Page • HTML defines Web sites content through semantic tags (headings, paragraphs, lists, …). • CSS defines 'rules' or 'styles' for presenting every aspect of an HTML document • Font (family, size, color, weight, etc.) • Background (color, image, position, repeat) • Position and layout (of any object on the page) • JavaScript defines dynamic behavior • Programming logic for interaction with the user, to handle events, etc.

  3. Java Scripts • JavaScript is a front-end scripting language developed by Netscape for dynamic content • Lightweight, but with limited capabilities • Can be used as object-oriented language • Client-side technology • Embedded in your HTML page • Interpreted by the Web browser • Simple and flexible • Powerful to manipulate the DOM

  4. What Java Script can do? • Can handle events • Can read and write HTML elements and modify the DOM tree • Can validate form data • Can access / modify browser cookies • Can detect the user’s browser and OS • Can be used as object-oriented language • Can handle exceptions • Can perform asynchronous server calls (AJAX) • Slider kind of behaviour in web pages

  5. Use of Java Scripts • Internal declaration • <script>…. </script> • External Declaration <script src="scripts.js" type="text/javscript"> <!– code placed here will not be executed! --> </script>

  6. Alert box • Alert() : will display the alert box.(Pop-up) • i.e = alert(“Hello world”); • Some of the character will use in alert box • \n : New line • \t : Horizontal Tab • \r : Carriage Return • \\ : Use backslash in text • \” : Use double quote in text • \’ : Use single quote in text

  7. Write • To write any thing on page we use write() • i.e. documents.write(“Hello World”); • documents.write(“<h1>Hello World</h1>”); • documents.write(“ \ ” Hello World ” \ ”); • documents.writeln(“Hello World”); • document.write(“<h1 style=“color:Yellow”>NirmaUni </h1>”); • document.write(“<h1 style= \ ” color:Yellow \” >NirmaUni </h1>”);

  8. prompt • Which allows user to input a value that the script can use. var name; name = window.prompt("Hello"); document.write("Welcome " + name + " for visiting site");

  9. Mathematical operation • + , - , *, / , % • Precedence • Equality operators i.e. = , != • Relational operators i.e. > , < , >= , <=

  10. Date • var now = Date(); • getHours(); • getDay • getDate • parse : Parses a date string and returns the number of milliseconds since midnight of January 1, 1970

  11. Variable • var x;               // Now x is undefinedvar x = 5;           // Now x is a Numbervar x = "John";      // Now x is a String • var answer="It's alright";var answer="He is called 'Johnny'";var answer='He is called "Johnny"'; • var x1=34.00;      //Written with decimalsvar x2=34;         //Written without decimals

  12. Continue • varcarname=new String;var x=      new Number;var y=      new Boolean;var cars=   new Array;var person= new Object; • var person={firstname : "John",lastname  : "Doe",id        :  5566}; • Name = person.firsname ; //person[“firstname”]

  13. Continue • varlastName = "Doe", age = 30, job = "carpenter"; • typeof "John"                 // Returns string typeof 3.14                   // Returns numbertypeof false                  // Returns booleantypeof [1,2,3,4]              // Returns objecttypeof {name:'John', age:34}  // Returns object

  14. Array • var cars=new Array();cars[0]="Saab";cars[1]="Volvo";cars[2]="BMW"; • var cars=new Array("Saab","Volvo","BMW"); • var cars=["Saab","Volvo","BMW"];

  15. Objects • Objects are just a data, with added properties and methods. • Almost "everything" in JavaScript are treated as objects. Dates, Arrays, Strings, Functions.... • You can make your own objects as well • i.e. var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

  16. Strings • var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";varsln = txt.length; • var x = "John";var y = new String("John");typeof x // returns Stringtypeof y // returns Object

  17. Functions of Strings • length • search • indexof • slice() // (7,12) (-12,-6) (7) • substring() • substr() // (7,6) • replace() • toUpperCase() • toLowerCase() • concat() • charAt() • charCodeAt() • var txt = "a,b,c,d,e"    // Stringtxt.split(",");     // Split on commastxt.split(" ");     // Split on spacestxt.split("|");    // Split on pipe

  18. Number and functions • Precision: Integers (numbers without a period or exponent notation) are considered accurate up to 15 digits. • The maximum number of decimals is 17, but floating point arithmetic is not always 100% accurate: • Infinity (or -Infinity) is the value JavaScript will return if you calculate a number outside the largest possible number. • var x = 123;var y = new Number(123);typeof x;               // returns numbertypeof y;               // returns object

  19. Continue • It will convert string in to integer. • N1 = parseInt(firstnum); • N1 = parseFloat(firstnum); • tostring(); • toExponential() • toFixed() • toPrecision() • Number() • valueOf()

  20. Math • Math.random(); • Math.min(x,y,z); • Math.max(x,y,z); • Math.round(x); • Math.ceil(x); • Math.floor(x); • abs(x); • pow(x,y); • sqrt(x);

  21. Array • var person = ["John", "Doe", 46]; • var cars = new Array("Saab", "Volvo", "BMW"); • var car = new Array(40); • car.length(); • car.sort(); • valueof(); • tostring(); • join(“*”); • splice(2, 0, “Maruti", “Honda");

  22. Condition • if (condition)  {  code to be executed if condition is true  }else  {  code to be executed if condition is not true  }

  23. Switch • switch(n){case 1:  execute code block 1  break;case 2:  execute code block 2  break;default:  code to be executed if n is different from case 1 and 2}

  24. Loops • while (condition)  {  code block to be executed} • do  {  code block to be executed}while (condition);

  25. Continue • for (statement 1; statement 2; statement 3)  {  the code block to be executed} • var person={fname:"John",lname:"Doe",age:25}; for (x in person)  {  txt=txt + person[x];  }

  26. Functions • A JavaScript function is defined with the function keyword, followed by a name, followed by parentheses (). • Function names can contain letters, digits, underscores, and dollar signs (same rules as variables). • The parentheses may include parameter names separated by commas: (parameter1, parameter2, ...) • The code to be executed, by the function, is placed inside curly brackets: {}

  27. Continue • Invoke the fuction • var x = myfunction(4,3);

  28. Finding the HTML elements

  29. Change elements and attributes of HTML

  30. Regular Expression • A regular expression can be written in either of two ways: • varpatt = new RegExp(pattern,modifiers); • Or • varpatt = /pattern/modifiers; • pattern specifies the pattern of an expression • modifiers specify if a search should be global, case-sensitive, etc.

  31. Modifiers

  32. Brackets

  33. Meta Character

More Related