1. Introduction to JavaScript

2. Aim To enable you to write you first JavaScript

3. Overview What is it How does it work What is Java Using JavaScript

4. What is JavaScript? JavaScript is a scripting language A scripting language is a lightweight programming language A JavaScript is lines of executable computer code combined with HTML code. The code is interpreted and not compiled. We will be running it on the browser rather than the server.

5. What is JavaScript? JavaScript is an open scripting language that anyone can use without purchasing a license JavaScript was developed by Netscape and is now supported by all major browsers including Internet Explorer. It will not run on a client machine if JavaScript has been switched off in the browser, for whatever reason.

6. What is JavaScript? JavaScript allows for interactivity to be introduced into the static world of HTML. It allows Browser/page manipulation e.g.: –display scrolling messages in the status bar –create mouse over effects It can be incorporated in to a web page with cut and paste Easy to learn

7. How Does it Work? When a JavaScript is inserted into an HTML document, the Internet browser will read the HTML and interpret the JavaScript. The JavaScript can be viewed along with the HTML code by right clicking in the browser (NB Sometimes the JavaScript will be pulled from an external file).

8. What can a JavaScript Do? JavaScript gives HTML designers a programming tool –HTML authors are normally not programmers, but JavaScript is a very light programming language with a very simple syntax! –Almost anyone can start putting small "snippets" of code into their HTML documents.

9. JavaScript can react to events A JavaScript can be set to execute when something happens, like when a page has finished loading or when a user clicks on an HTML element. JavaScript can read and write HTML elements A JavaScript can read an HTML element and change the content of an HTML element.

10. JavaScript can be used to validate data JavaScripts can be used to validate data in a form before it is submitted to a server. This function is particularly well suited to save the server from extra processing.

11. Blue JavaScript tags Red JavaScript GreenUser Defined Try to master putting alerts into your HTML code in the tutorial.

12. How to Put a JavaScript into an HTML Document document.write("Hello World!")

13. And it produces the output: Hello World!

14. To insert a script in an HTML document Use the tag. Use the type attribute to define the scripting language. Then comes the JavaScript: In JavaScript the command for writing some text on a page is document.write: document.write("Hello World!") The script ends:

15. How to Handle Older Browsers Older browsers that do not support scripts will display the script as page content. To prevent them from doing this, you can use the HTML comment tag:

16. Commenting out The two forward slashes in front of the end of comment line (//) are a JavaScript comment symbol, and prevent the JavaScript from trying to compile the line. Note that you can't put // in front of the first comment line (like //<!--), because older browsers will display it.

17. Alert box How to display an alert box. alert("Hello World!")

18. Alert box How to display an alert box. alert("Hello World!") alert("No really hello!")

19. Understanding variables A variable is a place in which to store data for manipulating within a Javascript program. //Creating a variable called name: var name; //Putting something in it (beware to reformat” “ if you cut and paste from here): name = “Roger”; //Display it: document.write(name)

20. JavaScript can put dynamic text into an HTML page Hi there var name; name = "Roger"; document.write (name)

21. Prompt box 1 var name = prompt("Please enter your name","") alert("Hello " + name + "! How are you today?")

22. Prompt box 2 var name = prompt("Please enter your name","") document.write("Hello " + name)

23. Using functions function myfunction() { alert("HELLO") }

24. Using functions (continued) <input type="button" onclick="myfunction()" value="Call function"> By pressing the button, a function will be called. The function will alert a message.

25. Beware Be careful when you copy and paste “ “ they may need deleting and and re- entering in notepad.

26. Reference http://www.w3schools.com/ http://javascript.internet.com/ http://hotwired.lycos.com/webmonkey/prog ramming/javascript/tutorials/jstutorial_inde x.htmlhttp://hotwired.lycos.com/webmonkey/prog ramming/javascript/tutorials/jstutorial_inde x.html