0 index
1 Making Web Pages "Interactive"
2 Java
3 Java Applets
4 Advantages
5 Disadvantages
6 What can Java Applets Do?
7 Where to Get Applets
8 Adding an Applet to a Page
9 JavaScript
10 Basics of JavaScript
11 Variables
12 Creating Variables
13 Input
14 References for JavaScript Information
15 DHTML
16 Advantages to DHTML
17 Disadvantages
18 DOM

outline
created using slideshow.cgi by Andy Harris















CSCI N241 Web Design: Javascript, Java and more
1. Making Web Pages "Interactive"
  • What sets web pages apart from just a printed page?
    - motion
    - sound effects
    - the ability of the user to manipulate things on the screen
    - animation and video



































CSCI N241 Web Design: Javascript, Java and more
2. Java
  • Java is an object-oriented programming language developed by Sun Microsystems
  • Not related to JavaScript, which is a scripting language developed to run within an HTML document in a browser



































CSCI N241 Web Design: Javascript, Java and more
3. Java Applets
  • A self-contained mini-executable program
  • Named with a .class suffix
  • Can be placed right on a web page like a graphic



































CSCI N241 Web Design: Javascript, Java and more
4. Advantages
  • Platform independent
  • Download completely and run on the client-side
  • Compact and download quickly
  • Do not require a proprietary plug-in



































CSCI N241 Web Design: Javascript, Java and more
5. Disadvantages
  • Browsers are temperamental in dealing with Java applets
  • Takes time for a browser to initialize Java



































CSCI N241 Web Design: Javascript, Java and more
6. What can Java Applets Do?
  • Everything from simple animations to flight simulators
  • Java allows for computations on-the-fly
  • Other things they can do:
    - utilities (calculators, clocks, calendars, etc)
    - text effects (scrolling marquees, wiggling text, etc.)
    - audio effects (digital "guitars", radio buttons, etc.)
    - games



































CSCI N241 Web Design: Javascript, Java and more
7. Where to Get Applets



































CSCI N241 Web Design: Javascript, Java and more
8. Adding an Applet to a Page
  • Download the .class file along with any associated image or audio files
  • Save the file in the same directory as the HTML file
  • Place on the web page using the <applet>….</applet> tags



































CSCI N241 Web Design: Javascript, Java and more
9. JavaScript
  • A client-side scripting language
  • Placed directly in the HTML document
  • Syntax:
    <SCRIPT LANGUAGE = "JavaScript">
    Add the script here
    </SCRIPT>



































CSCI N241 Web Design: Javascript, Java and more
10. Basics of JavaScript
  • Simple output - the alert box
    - output statements will have some string value to be shared with the user
  • Example:- Hello World
    <HTML>
    <SCRIPT>
    alert("Hello World");
    </SCRIPT>
    </HTML>



































CSCI N241 Web Design: Javascript, Java and more
11. Variables
  • Containers that hold some type of data (like a refrigerator container)
  • Characteristics of variables:
    - name
    - type
    - initial value



































CSCI N241 Web Design: Javascript, Java and more
12. Creating Variables
  • The var statement
    - var userName = "Susan";
    - alert(userName);
  • The = does not mean "equals" but means "gets" as the variable userName gets the value of "Susan"
  • We then output the variable userName value "Susan" in an alert message to the user



































CSCI N241 Web Design: Javascript, Java and more
13. Input
  • Uses the prompt statement
  • Syntax:
    variable = prompt(question)
  • Example:
    userName = prompt ("What is your name?");
  • The answer from the user is stored in the variable userName which then could be sent back to the user using an alert message
    alert ("Hello " + userName);



































CSCI N241 Web Design: Javascript, Java and more
14. References for JavaScript Information
  • A good book for JavaScript information
    JavaScript Bible by Danny Goodman



































CSCI N241 Web Design: Javascript, Java and more
15. DHTML
  • Dynamic HTML - web pages that move, animate or respond to the user after downloading
  • Works in conjunction with:
    - HTML 3.2
    -JavaScript
    -CSS
    -Document Object Model (DOM)



































CSCI N241 Web Design: Javascript, Java and more
16. Advantages to DHTML
  • Small file sizes
  • Supported by both major browser manufacturers
  • Will be a standard
  • No plug-in necessary
  • Does not require a Java Virtual Machine



































CSCI N241 Web Design: Javascript, Java and more
17. Disadvantages
  • Only new browsers support DHTML
  • Netscape and Microsoft IE have different DHTML implementations
  • DHTML has a sharp learning curve
  • Unprotected source code



































CSCI N241 Web Design: Javascript, Java and more
18. DOM
  • The Document Object Model exposes every element of an HTML page to a scripting language such as JavaScript.
  • DOM begins with a base object call the "window" which refers to the browser window
  • Within the window object is a document object
  • The document object refers to the HTML page and everything in it
  • JavaScript Example:
    document.images["images_name"]



































outline

Making Web Pages "Interactive"

Java

Java Applets

Advantages

Disadvantages

What can Java Applets Do?

Where to Get Applets

Adding an Applet to a Page

JavaScript

Basics of JavaScript

Variables

Creating Variables

Input

References for JavaScript Information

DHTML

Advantages to DHTML

Disadvantages

DOM