Sunday, November 14, 2010

Introduction to JavaScript

Get acquainted with JavaScript Outcome: Students will learn what JavaScript is, where to put scripts in an HTML document and how to write simple scripts. Objectives: 1.1 JavaScript vs Java vs HTML, automatic & triggered scripts 1.2 Where to put your scripts in an HTML document 1.3 How to hide scripts from old web browsers 1.4 How to put comments in scripts 1.5 Alert boxes 1.6 Confirm & Prompt boxes 1.7 Calling functions with a button - MCQ assignment 1. What is JavaScript and how is different from JAVA and HTML? see table 2. Types of JavaScript Client side - runs in browser Server side - runs on server - embeded in web page but processed on server 3. Scripts can run automatically or be user triggered 4. Placing Scripts a) in Head tag - this prevents user triggered errors during downloading b) in body - including within body tag as an attribute c) within forms as Event handlers - script tag not required 5. Can be copied from web page code can be copyrighted JAVA Developed by Sun Microsystems James Gosling 199(originally called Oak changed to Java 1993) True programming compiled to bytecode (not machine code) platform independent Object oriented - can create their own classes Currently version 1.2 Requires machine specific interpretor or can use a web browser fully extensible i.e. has unlimited no of objects including classes with inheritance case sensitive can be used for client server interaction In web pages - Applets can not be copied from web page - user must make program available code can be copyrighted 6. Comment TAGS HTML JavaScript // single line comment /* multiple line comments */ Adding comments to your script is very important so that you and others know what the various components do especially if you examine the script after several months. Netscape 1.0 does not support JavaScript Internet Explorer 2.0 earlier does not support JavaScript Some other browsers including most WYSIWYG HTML editors do not support JavaScript Make sure you view scripts in both major browsers to see if it works! 7. Dot Syntax document.write() document = object write() = method something the object does object. property.method() Hierachy window is the top not necessary to include window.document.write() window.alert() Note JavaScript is case sensitive! 8. Parenthesis " " or ' ' double or single can mix " ' " " always pair properly "" says treat as a literal value 9. Braces - Chicken lips - used with functions { { } } 10. Outputting to Screen (Can not send to printer) document.write("Hello World") document.writeln("Hello World") l is small letter L need
 tag before and script tag to work
Can include HTML tags inside
document.write("

Hellow World") Need to use

or
tag to move to next line Can also use \n see Chapter 2 page 14 11) Alert boxes - see Chapter 2 page 17 - Negrino Book. alert("message") automatic alert by placing in tags top object is window.alert("message") not necessary to include window user triggered alert by placing in form button using no script tags just event Handler onClick="alert('message')" and form note use of two "" '' parenthesis Then create a function saySomething() activate with a button - this will be the basis of homework assignment. CAUTION: when using notepad to input code do not place a carriage return inside a JavaScript statement or line of code - it will not work! Also make sure you add the .html extension to the file name when saving your scripts in web page. 12) Confirm(" Question") returns Boolean True or False if you choose cancel returns null - ie nothing Confirm('Are aliens visiting our planet?) Include and If else statement and write out a reply 13) Prompt box - user input prompt("Question", "text") you can store information in the prompt by assigning a variable to the prompt var=prompt("What is your name", "name") document.write("

Greetings" + var + "

")

No comments: