1. Javascript Overview

2. What is Javascript? May be one of the most popular programming languages ever Runs in the browser, not on the server All modern browsers support javascript Easy to learn Is NOT Java; completely different in concept and design

3. What Can You Do? Change html content http://www.w3schools.com/js/tryit.asp?filename=tr yjs_intro_inner_html Change html attributes http://www.w3schools.com/js/tryit.asp?filename=tr yjs_intro_lightbulb Validate data in the browser http://www.w3schools.com/js/tryit.asp?filename=tr yjs_intro_validate

4. Where to place Javascript Can be placed in the body OR head; best to put in a separate.js file. Keep your javascript all in one place In html code, must put between tags document.getElementById("demo").innerHT ML = "My First JavaScript";

5. Head and Body Examples Head Example: http://www.w3schools.com/js/tryit.asp?filename=tryjs_ whereto_head Body Example: http://www.w3schools.com/js/tryit.asp?filename=tryjs_ whereto_body External File: http://www.w3schools.com/js/tryit.asp?filename=tryjs_ whereto_external

6. External File Advantages Separates html and code Makes html and Javascript easier to read and maintain Cached Javacript files can speed up page loads

7. Display Possibilities Write to an alert box using window.alert() Write to html output using document.write() Write to an html element using innerHTML Write into the browser console using console.log()

8. Using innerHTML Use the document.getElementById(id) method. – Remember when we covered the DOM? The id attribute defines the html element; the innerHTML property defines the html content http://www.w3schools.com/js/tryit.asp?filename=tr yjs_output_dom

9. Language Syntax, Statements, Variables, Operators, Datatypes http://www.w3schools.com/js/js_syntax.asp

10. Functions A block of code designed to perform a particular task Executed when something invokes it Defined bwith the function keyword, followed by a name, followed by parentheses() The parentheses may include parameter names followed by commas: (parameter1, parameter2) The code to be executed is included in {} The functions often compute a return value, which can be returned to the caller http://www.w3schools.com/js/tryit.asp?filename=tryjs_funct ion_return

11. Objects Objects are variables too but can contain many values and functions http://www.w3schools.com/js/js_objects.asp

12. Events Things that happen to html elements (i.e., the browser initiates or the user initiates) Javascript can “react” to on these events to do something you want done Html allows event handler attributes, with javascript code, to be added to html elements http://www.w3schools.com/js/tryit.asp?filename=tryjs_event_ onclick1