Java Script 1 Java Script vs Java Script
![Java. Script (1) Java. Script (1)](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-1.jpg)
![Java. Script vs. Java. Script and Java are completely different • Java, invented by Java. Script vs. Java. Script and Java are completely different • Java, invented by](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-2.jpg)
![Document Object Model Platform and language neutral interface Allows programs and scripts to dynamically Document Object Model Platform and language neutral interface Allows programs and scripts to dynamically](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-3.jpg)
![DOM Represents the document as a forest of Nodes <table> <tbody> <tr> <td>foo</td> <td>bar</td> DOM Represents the document as a forest of Nodes <table> <tbody> <tr> <td>foo</td> <td>bar</td>](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-4.jpg)
![DOM Interfaces DOMException only raised in ‘exceptional’ cases Document : Node • Document. Type, DOM Interfaces DOMException only raised in ‘exceptional’ cases Document : Node • Document. Type,](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-5.jpg)
![DOM Interface Node • Node. Type, parent. Node, child. Nodes • Node insert. Before(new. DOM Interface Node • Node. Type, parent. Node, child. Nodes • Node insert. Before(new.](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-6.jpg)
![DOM Interface Element • DOMString get. Attribute(name) • set. Attribute(name, value) • Attr get. DOM Interface Element • DOMString get. Attribute(name) • set. Attribute(name, value) • Attr get.](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-7.jpg)
![Java. Script Placed inside <script></script> tags • no longer need type=“text/javascript” • <script> tags Java. Script Placed inside <script></script> tags • no longer need type=“text/javascript” • <script> tags](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-8.jpg)
![Java. Script Structure Statements tell the browser what to do • var x=3; Should Java. Script Structure Statements tell the browser what to do • var x=3; Should](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-9.jpg)
![Java. Script Types Strings • var fname=‘Cam’; var lname=“Moore”; Numbers • var x=3; var Java. Script Types Strings • var fname=‘Cam’; var lname=“Moore”; Numbers • var x=3; var](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-10.jpg)
![Java. Script Functions use the ‘function’ keyword • function my. Function(name, job) { } Java. Script Functions use the ‘function’ keyword • function my. Function(name, job) { }](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-11.jpg)
![Java. Script Operators Arithmetic: • +, -, *, /, %, ++, -Assignment: • =, Java. Script Operators Arithmetic: • +, -, *, /, %, ++, -Assignment: • =,](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-12.jpg)
![Condition Statements • if(condition){…}else{…} • if(condition){…}else if(condition 2){…}else{…} • switch(n){case 1: …break; …; default: Condition Statements • if(condition){…}else{…} • if(condition){…}else if(condition 2){…}else{…} • switch(n){case 1: …break; …; default:](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-13.jpg)
![Loops • for(init; condition; increment) {…} - Classic for loop • for(x in person) Loops • for(init; condition; increment) {…} - Classic for loop • for(x in person)](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-14.jpg)
![Java. Script Labels Similar to goto statements (EVIL) label: … break label; … continue Java. Script Labels Similar to goto statements (EVIL) label: … break label; … continue](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-15.jpg)
- Slides: 15
![Java Script 1 Java. Script (1)](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-1.jpg)
Java. Script (1)
![Java Script vs Java Script and Java are completely different Java invented by Java. Script vs. Java. Script and Java are completely different • Java, invented by](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-2.jpg)
Java. Script vs. Java. Script and Java are completely different • Java, invented by Sun in 1995, is a complex programming language and platform • Java. Script, invented by Brendan Eich in 1995, is a scripting language. - First used by the Netscape browser - Adopted by ECMA in 1997 - Provides access the HTML Document Object Model (DOM) (2)
![Document Object Model Platform and language neutral interface Allows programs and scripts to dynamically Document Object Model Platform and language neutral interface Allows programs and scripts to dynamically](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-3.jpg)
Document Object Model Platform and language neutral interface Allows programs and scripts to dynamically access and update: • Content • Structure • Style of HTML documents (3)
![DOM Represents the document as a forest of Nodes table tbody tr tdfootd tdbartd DOM Represents the document as a forest of Nodes <table> <tbody> <tr> <td>foo</td> <td>bar</td>](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-4.jpg)
DOM Represents the document as a forest of Nodes <table> <tbody> <tr> <td>foo</td> <td>bar</td> </tr> <td>baz</td> <td>qux</td> </tr> </tbody> </table> (4) <table> <tbody> <tr> <td> foo bar baz qux
![DOM Interfaces DOMException only raised in exceptional cases Document Node Document Type DOM Interfaces DOMException only raised in ‘exceptional’ cases Document : Node • Document. Type,](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-5.jpg)
DOM Interfaces DOMException only raised in ‘exceptional’ cases Document : Node • Document. Type, DOMImplementation, Element • • (5) Element create. Element(tag) raises DOMException Text create. Text. Node(data) Comment create. Comment(data) Attr create. Attribute(name) raises DOMException Element get. Element. By. Id(id) Node. List get. Elements. By. Tag. Name(name) Node. List get. Elements. By. Class. Name(name)
![DOM Interface Node Node Type parent Node child Nodes Node insert Beforenew DOM Interface Node • Node. Type, parent. Node, child. Nodes • Node insert. Before(new.](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-6.jpg)
DOM Interface Node • Node. Type, parent. Node, child. Nodes • Node insert. Before(new. Child, ref. Child) raises • • (6) DOMException Node replace. Child(new. Child, old. Child) raises DOMException Node remove. Child(old. Child) raises DOMException Node append. Child(new. Child) raises DOMException boolean has. Child. Nodes()
![DOM Interface Element DOMString get Attributename set Attributename value Attr get DOM Interface Element • DOMString get. Attribute(name) • set. Attribute(name, value) • Attr get.](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-7.jpg)
DOM Interface Element • DOMString get. Attribute(name) • set. Attribute(name, value) • Attr get. Attribute. Node(name) • Attr set. Attribute. Node(new. Attr) • Node. List get. Elements. By. Tag. Name(name) (7)
![Java Script Placed inside scriptscript tags no longer need typetextjavascript script tags Java. Script Placed inside <script></script> tags • no longer need type=“text/javascript” • <script> tags](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-8.jpg)
Java. Script Placed inside <script></script> tags • no longer need type=“text/javascript” • <script> tags can be in <head> or <body> • <script src=“filename. js”></script> loads external script file (8)
![Java Script Structure Statements tell the browser what to do var x3 Should Java. Script Structure Statements tell the browser what to do • var x=3; Should](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-9.jpg)
Java. Script Structure Statements tell the browser what to do • var x=3; Should end with ; Code is a sequence of Java. Script statements Blocks of code is grouped with {} Java. Script is case sensitive • my. Var != myvar Uses C++ comments // and /* */ (9)
![Java Script Types Strings var fnameCam var lnameMoore Numbers var x3 var Java. Script Types Strings • var fname=‘Cam’; var lname=“Moore”; Numbers • var x=3; var](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-10.jpg)
Java. Script Types Strings • var fname=‘Cam’; var lname=“Moore”; Numbers • var x=3; var y=2. 1; Boolean • true, false Arrays • var foo=Array(); var bar=[‘a’, ‘b’, 3]; Objects • var person={fname: ”John”, lname: ”Doe”, id=3} (10)
![Java Script Functions use the function keyword function my Functionname job Java. Script Functions use the ‘function’ keyword • function my. Function(name, job) { }](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-11.jpg)
Java. Script Functions use the ‘function’ keyword • function my. Function(name, job) { } (11) alert(“Welcome “ + name + “, the “ + job); var x=5; return x;
![Java Script Operators Arithmetic Assignment Java. Script Operators Arithmetic: • +, -, *, /, %, ++, -Assignment: • =,](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-12.jpg)
Java. Script Operators Arithmetic: • +, -, *, /, %, ++, -Assignment: • =, +=, -=, *=, /=, %= Comparison: • ==, ===, !=, >, <, >=, <= Logical: • &&, ||, ! Condition: • x=(condition)? value 1: value 2; (12)
![Condition Statements ifconditionelse ifconditionelse ifcondition 2else switchncase 1 break default Condition Statements • if(condition){…}else{…} • if(condition){…}else if(condition 2){…}else{…} • switch(n){case 1: …break; …; default:](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-13.jpg)
Condition Statements • if(condition){…}else{…} • if(condition){…}else if(condition 2){…}else{…} • switch(n){case 1: …break; …; default: …} (13)
![Loops forinit condition increment Classic for loop forx in person Loops • for(init; condition; increment) {…} - Classic for loop • for(x in person)](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-14.jpg)
Loops • for(init; condition; increment) {…} - Classic for loop • for(x in person) {…} - Loops over all properties in person • while(condition){…} - Classic while loop • do{…}while(condition); - Classic do/while loop (14)
![Java Script Labels Similar to goto statements EVIL label break label continue Java. Script Labels Similar to goto statements (EVIL) label: … break label; … continue](https://slidetodoc.com/presentation_image_h/1eeee2bc6d2d1d2932682518e978e7db/image-15.jpg)
Java. Script Labels Similar to goto statements (EVIL) label: … break label; … continue label; (15)
Script de java
Inside which html element do we put the java script
"java script"
Java script classes
"java script"
What is java scripts
Java script email
"java script"
Khan academy object oriented programming
Java script wikipedia
Java script ide
Java script course
Java script examples
Language
Riad wahby
"java script"