1. CS-3432 Electronic Commerce Lecture – 13 Sikandar Shujah Toor https://sites.google.com/site/uolcsecom

2. onmouseover & onmouseout Onmouseover event <IMG SRC=moon.jpg WIDTH=200 HEIGHT=100 BORDER=0 NAME=picture onmouseover="picture.src='moon.jpg';picture.width=500; picture.height=350" onmouseout="picture.src='leopard.jpg';picture.width=600; picture.height=450">

3. onmouseover & onmouseout

4. <A href=leopard.jpg onmouseover="picture.src='moon.jpg';picture.width=500; picture.height=300" onmouseout="picture.src='moon.jpg';picture.width=170; picture.height=50"> <IMG SRC=moon.jpg WIDTH=200 HEIGHT=100 BORDER=2 NAME=picture> Anchor

6. Operators in JavaScript + For addition of two numbers and concatenation of two strings - for subtraction of two numbers * for multiplication of two numbers / for division of two numbers % modulus (calculating the remainder) ++ increment in number -- decrement in number

7. Logical Operators && logical and || logical or ! logical not if(x<y&&x<z) { any statement } if(!false){ statement }

8. Comparison Operators == Equal != not equal < Less than <= less than equal > Greater than >= Greater than equal

9. Javascript Example alert("Thank you for visiting our web site!") Java Script Example

11. Writing on a Page example-writing on the page <!-- document.write("Hello! Thank you for visiting our site.") //-->

12. Writing on a Page

13. Functions Definition Function is a block of code which is executed when someone calls it Defined as follows function my1stfunction(arg1, arg2, arg3) { // some code } When called, variables and arguments must be in expected order

14. Displaying System Date function displayDate(){ document.getElementById(“systemdt”).innerHTML=Date(); } My First JavaScript This is a paragraph. Display Date

16. <!-- function Addit(){ var num1=document.Calform.fst.value; var num2=document.Calform.scnd.value; alert(parseFloat(num1)+parseFloat(num2)); } function minus(){ var num1=document.Calform.fst.value; var num2=document.Calform.scnd.value; alert(parseFloat(num1)-parseFloat(num2)); } //--> Add and Subtract Calculator 1st Number: 2nd Number: Simple Calculator

17. Simple Calculator – Add

18. Simple Calculator – Minus

19. Loops Loops executes a block of code repeatedly until a condition is met Following types of loops present in JS For loop for(intialization;condition;increment) {statements} While loop while(codition){statements} Do while loop do{statements}while(condition) Do-while loop executes at least once

20. For Loop Using the For Loop for(i=1;i<7;i++) document.write(" For Loop Example "+i+“ !! ");

21. For Loop Example

22. While Loop Using the While Loop <!-- var i = 1; while (i < 7){ document.write(" While Loop Example "+i+"!! "); ++i; } //-->

23. While Loop Example

24. Do-while Loop Using the While Loop <!-- var i = 1; do { document.write(" Do-While Loop Example "+i+"!! "); ++i; } while (i < 1); //--> Loop executed once although the condition is false from the beginning

25. Do-while Loop Example

26. Java Script Objects Everything in Java Script is an Object which is a combination of data, properties and methods Properties are the values associated with the object Methods are the actions which can be performed on the object New objects can be inherited with “new” key word person = new Object() Object Properties can be set / retrieved by using “.” after object name person.name=“Uzair”; Methods can be called by the same “.” after object name var name = persone.getName();

27. Some Predefined JS Objects Global Array String Math Date … etc.

28. Example of Math object Using the Math object Using the Math object <!-- document.write("Math.PI :" +Math.PI +" "); document.write("Math.LN2 :"+Math.LN2+" "); document.write("Math.sin(90) :"+Math.sin(90)+" "); document.write("Math.random() :"+Math.random()+" "); document.write("Math.pow(2,3) :"+Math.pow(2,3)+" "); document.write("Math.min(123,133): "+Math.min(123,133)+" "); //-->

29. Math Object Example

30. Array Object Using Arrays Using Arrays <!-- myArray=[0,1,2,3,4,5,6,7,8,9,10]; document.write("myArray: first element " +myArray[0]+" "); document.write("myArray.toString(): "+myArray.toString()+" "); document.write("myArray.join(':'): "+myArray.join(':')+" "); document.write("myArray.reverse(): "+myArray.reverse()+" "); document.write("myArray.sort(): "+myArray.sort()+" "); //-->

31. Array Object