Javascript1
Upcoming SlideShare
Loading in...5
×
 

Javascript1

on

  • 535 views

java

java

Statistics

Views

Total Views
535
Views on SlideShare
530
Embed Views
5

Actions

Likes
1
Downloads
3
Comments
0

1 Embed 5

http://it.comyr.com 5

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Javascript1 Javascript1 Presentation Transcript

  • Making dynamic pages withjavascript Lecture 1
  • Java script java versus javascript Javascript is a scripting language that will allow you to add real programming to your webpages. Its not stand alone language as java.
  • uses for javascript Browser Detection Detecting the browser used by a visitor at your page. Depending on the browser, another page specifically designed for that browser can then be loaded. Cookies Storing information on the visitors computer, then retrieving this information automatically next time the user visits your page. This technique is called "cookies". Control Browsers Opening pages in customized windows, where you specify if the browsers buttons, menu line, status line or whatever should be present. Validate Forms Validating inputs to fields before submitting a form. An example would be validating the entered email address to see if it has an @ in it, since if not, its not a valid address. View slide
  • Position of script tag1. Internal  Between the head tag / body tag  What is the different between the scripting between head tag and between body tag?  In the tag itself  example <p onclick=“ alert(‘good’)”> text </p>2. External <HTML> One <Head> quote <SCRIPT LANGUAGE="JavaScript" src=“jfile.js"></SCRIPT> </Head> <Body> </Body> </HTML> View slide
  • Components of javascript1. <script> tag2. Objects ( window, document, form)1. Properties document.color1. Methods document.write( ) document.write( string)1. Variables var name=“ ali” var age=301. Operators and expression  + ,- , % ,/ …..
  • .Cont6. Statements  If - If … else  For  while7. Event handlers.  KB events: onkeydown – onkeyup- onkeypress  Mouse events : onmousemove – onmouseover- onmousedown- onmouseout- onmouseup- onclick- ondblclick  Load & unload  Its specified in the <body> tag.  <body onload=“……”>
  • Script tag <SCRIPT LANGUAGE="JavaScript"> <!-- Comment tag document.write ("Hello World"); //--> code </SCRIPT>Notes: Its necessary to but the code between comment tag. Why? Case sensitive write (ex. document.Write <> document.write) Comment statement (// or /* */)
  • output methods1. alert2. Write3. Print
  • alert alert (“ text”) = window.alert(“ text”) Ex.  In the tag :<TagName event=”code statement"></TagName>  Example : <p onclick= “ alert(‘ click is occurred’) “ > click </p>  Using script tag in the head <head> <SCRIPT LANGUAGE="JavaScript"> Function <!-- without function demo() parameter { alert ("Hello World"); } Calling //--> function </SCRIPT> when event </head> is occurred Calling: <p onclick=“ demo( ) “ > click </p>
  • Write method Examples:  documet.write(“hello”)  document.write("<font color=ff0000> red text </font>”)  document.write("<font color=ff0000> red text </font> <br> <font color=00ff00> green text </font>”)  Notes:  Use tags within document
  • ( )Newline in write( ) and alertdocument.write(" ppu <br> graphics") alert(" are you sure n press OK" )
  • Print  window.print()
  • Input methods1. Confirm2. Prompt confirm  One of window methods as alert. It return value false/true by contrast of alert.  confirm(“ message "); or window.confirm(“ message");  to show the result: Alert( confirm (message) )
  • prompt Window method that pass a message to user (undefined is default value) Prompt( “message”, ”default value”) Alert(prompt(…….))
  • variables Types of variables:  String  Numbers  Boolean  Null Naming variables  Ex these variable names are correct  Address1  A4xb5  lastName  _firstName  parent_Name  Not correct  1stName  ?subName  last name  @ userID
  • Declaration/assignment var firstName; var firstName, lastName, userID; var firstName, lastName = “ali", userID = 13; assignment  var stname;  stname = "Ahmed“;
  • cont.<script> function demo( ){ var username = ”ali"; alert("welcomen"+username); }</script>- improve this code in order to accept your name fromthe KB.
  • Conditional statement If (condition) {…..} If (condition) {……} Else { ……} If (condition) {……} Else if ( ) { ……}
  • example<HEAD><SCRIPT LANGUAGE="JavaScript"><!--var age, name;name = prompt(“what’s your name”,”enter your name here");age=prompt(“what’s your age?”,”enter your age here");document.write( "<b> welcome : </b>" + name + "<br>" );If ( age<40)document.write( "<b> you still youth : </b>" + age+ "<br>" +”is your age”);document.write( "<b> you are experienced person : </b>" + age + "<br>" + ”is your age”);//--></SCRIPT></HEAD>
  • switchswitch(value/expression) {case " val1" :break;case " val2 " :break;case " val3 " :break;..default :
  • examplevar num = 4;switch( num ) { case 1 : alert( " num is n one " ); break; case 2 : alert( " num is n two " ); break; case 3 : alert( ” num is n three " ); break;default : alert( " num is " + num );break;}
  • Iteration For While Print your name four times, each one in a separate line. var x = 0; for( i=1; i<5 ; i++ ) { document.write( “ali” <br> ) }
  • while1- var i = 0; while( i<5 ) { document.write( “ali” + "<br>" ); i++; }2-var userPassword = "123";var password = prompt(“enter password", “password ");while( password != userPassword ){ alert( “ wrong try again " ); password = prompt(“enter password", “password ");}Alert (“its correct”);
  • Good site http://www.jsmadeeasy.com/javascripts/Pull%20Down%20Su http://www.yourhtmlsource.com/javascript/ http://www.webteacher.com/javascript/ch01.html