Introduction to JavaScript

  • 545 views
Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
545
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
25
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. JavaScriptTuesday, April 16, 13
  • 2. The Script Tag <script> alert("My First JavaScript"); </script>Tuesday, April 16, 13
  • 3. JavaScript LanguageTuesday, April 16, 13
  • 4. JavaScript Statements JavaScript statements are "commands" to the browser. The purpose of the statements is to tell the browser what to do. <script> document.getElementById("demo").innerHTML="Hello"; </script>Tuesday, April 16, 13
  • 5. Semicolon ; Semicolon separates JavaScript statements. You add a semicolon at the end of each executable statement. <script> document.getElementById("demo").innerHTML="Hello"; </script>Tuesday, April 16, 13
  • 6. JavaScript Code JavaScript code (or just JavaScript) is a sequence of JavaScript statements. Each statement is executed by the browser in the sequence they are written. <script> document.getElementById("demo").innerHTML="Hello"; document.getElementById("myDIV").innerHTML="Hi"; </script>Tuesday, April 16, 13
  • 7. JavaScript Functions The purpose of a function is to make the sequence of statements execute together when called <script> function myFunction() { document.getElementById("demo").innerHTML="Hello"; document.getElementById("myDIV").innerHTML="Hi"; } </script>Tuesday, April 16, 13
  • 8. JavaScript is Case Sensitive Watch your capitalization closely when you write JavaScript statements: A function getElementById is not the same as getElementbyID. <script> function myFunction() { document.getElementById("demo").innerHTML="Hello"; document.getElementbyId("demo").innerHTML="Hello"; } </script>Tuesday, April 16, 13
  • 9. JavaScript Comments Comments will not be executed by JavaScript. Comments can be added to explain the JavaScript, or to make the code more readable. Single line comments start with //. <script> function myFunction() { // Write to a heading document.getElementById("demo").innerHTML="Hello"; } </script>Tuesday, April 16, 13
  • 10. JavaScript Comments In the following example the comment is used to prevent the execution of one of the codelines (can be suitable for debugging): <script> function myFunction() { // document.getElementById("demo").innerHTML="Hello"; } </script>Tuesday, April 16, 13
  • 11. JavaScript Functions w/Arguments When you call a function, you can pass along some values to it, these values are called arguments or parameters. These arguments can be used inside the function. You can send as many arguments as you like, separated by commas (,) <script> function myFunction(parameter1, parameter2) { document.getElementById("demo").innerHTML= parameter1; document.getElementById("myDIV").innerHTML= parameter2; } </script>Tuesday, April 16, 13
  • 12. jQuery docs.jquery.comTuesday, April 16, 13
  • 13. jQuery jQuery commands with a call to the jQuery function. Here is how a jQuery statement is constructed. jQuery(‘p’).css(‘color’, ‘blue’); selector action parameters jQuery(‘p’) .css (‘color’, ‘blue’)Tuesday, April 16, 13
  • 14. jQuery selectors Same as CSS. Tags, Classes and IDs jQuery(‘p’).css(‘color’, ‘blue’); jQuery(‘.classname’).css(‘color’, ‘blue’); jQuery(‘#idname’).css(‘color’, ‘blue’);Tuesday, April 16, 13