CSIS 138 Javascript Class1

1,486 views
1,410 views

Published on

Instructor Teresa Pelkie at Palomar College - Introduction to JavaScript

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,486
On SlideShare
0
From Embeds
0
Number of Embeds
9
Actions
Shares
0
Downloads
71
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • The JavaScript Language consists of objects CSIS 138 Instructor Teresa Pelkie
  • CSIS 138 Javascript Class1

    1. 1. JavaScript – Class 1 Overview of the Basics <ul><li>Objects </li></ul><ul><ul><li>Properties </li></ul></ul><ul><ul><li>Methods </li></ul></ul><ul><ul><li>Events </li></ul></ul>
    2. 2. JavaScript Syntax <ul><li>document.bgColor = “red”; </li></ul><ul><li>document.write( ); </li></ul><ul><li>// change color to red </li></ul><ul><li>/* change color to red </li></ul><ul><li>and write to the page </li></ul><ul><li>*/ </li></ul>
    3. 3. JavaScript Objects <ul><li>Built in JavaScript Objects </li></ul><ul><ul><li>Navigator Object </li></ul></ul><ul><ul><li>Date Object </li></ul></ul><ul><ul><li>Math Object </li></ul></ul><ul><ul><li>String Object </li></ul></ul><ul><ul><li>Array Object </li></ul></ul>
    4. 4. JavaScript Objects <ul><li>Browser Objects </li></ul>
    5. 5. Where is JavaScript code placed? <ul><li><head> </li></ul><ul><li><script type=”text/JavaScript” language=&quot;JavaScript&quot;>  <!- - </li></ul><ul><li>statements go here ; //--> </li></ul><ul><li></script> </li></ul><ul><li></head> </li></ul>
    6. 6. Where is JavaScript code placed? <ul><li><head> </li></ul><ul><li><script type=”text/JavaScript”>  </li></ul><ul><li>statements go here ; </li></ul><ul><li></script> </li></ul><ul><li></head> </li></ul>
    7. 7. Where is JavaScript code placed? <ul><li><head> </li></ul><ul><li><script type=”text/JavaScript” src=”file.js”> </li></ul><ul><li></script> </li></ul><ul><li></head> </li></ul>
    8. 8. Where is JavaScript code placed? <ul><li><head> </li></ul><ul><li><script type=”text/JavaScript”>  statements go here ; </li></ul><ul><li></script> </li></ul><ul><li><script type=”text/JavaScript” src=”file.js”> </li></ul><ul><li></script> </li></ul><ul><li></head> </li></ul>
    9. 9. Where is JavaScript code placed? <ul><li><body> </li></ul><ul><li><a href=&quot;#&quot; onmouseover=“showPic();&quot;>click</a> </li></ul><ul><li><a href=”javascript:openWin();”>click</a> </li></ul><ul><li></body> </li></ul>
    10. 10. <noscript> You need JavaScript to see this page! </noscript>
    11. 11. Data and Types <ul><li>Information that we process and display </li></ul><ul><li>Can be in many forms or types </li></ul><ul><ul><li>Numeric </li></ul></ul><ul><ul><li>String </li></ul></ul><ul><ul><li>Boolean </li></ul></ul>
    12. 12. Variables <ul><li>Hold information or data </li></ul><ul><li>Can hold these types of data </li></ul><ul><ul><li>Numeric </li></ul></ul><ul><ul><li>String </li></ul></ul><ul><ul><li>Boolean </li></ul></ul>
    13. 13. How we create or declare a variable <ul><li>var myName; </li></ul>
    14. 14. Initializing a variable <ul><li>var myName; </li></ul><ul><li>myName = “Teresa”; </li></ul><ul><li>_______________________ </li></ul><ul><li>var myName = “Teresa”; </li></ul>
    15. 15. Initializing a variable <ul><li>var myAge; </li></ul><ul><li>myAge = 21; </li></ul><ul><li>_______________________ </li></ul><ul><li>var zipCode; </li></ul><ul><li>zipCode = “92082”; </li></ul>
    16. 16. The alert() method alert(); window.alert();
    17. 17. The alert() method <head> <script language=&quot;JavaScript&quot;> alert (&quot;This is an alert()&quot;); </script> </head>
    18. 18. The alert() method
    19. 19. The alert() method <script language=”JavaScript”> var myFirstVariable; myFirstVariable = “Hello!”; alert(myFirstVariable); </script>
    20. 20. The alert() method
    21. 21. The write() method <body> <script language=”JavaScript”> document.write (&quot;Hello World&quot;); </script> </body>
    22. 22. The write() method
    23. 23. The write() method <body> <script language=”JavaScript”> document.write (‘Hello “Big” World’); </script> </body>
    24. 24. The write() method
    25. 25. The write() method <script language=&quot;JavaScript&quot;> var firstVar; var secondVar firstVar = &quot;Hello&quot;; secondVar = &quot;World!&quot;; document.write( firstVar + “ “ + secondVar ); </script>
    26. 26. The write() method
    27. 27. The write() method <script language=&quot;JavaScript&quot;> var first; var last; first = “Teresa&quot;; last = “Pelkie&quot;; document.write(“<b>Hello “ + first + “ “ + last + “</b>”); </script>
    28. 28. The write() method
    29. 29. <ul><li>JavaScript – Class 1 </li></ul><ul><li>Assignment 1 </li></ul>

    ×