Chapter 13' JavaScript Programs for HTML

1
Chapter 13. JavaScript Programs for HTML

• JavaScript is an object-oriented language
  designed to interface with HTML
• The key features of an object-oriented language
• Encapsulation the combination of characteristics
  of an object along with its behaviors
• Polymorphism different classes of objects may
  have behaviors that are named the same but are
  implemented differently
• Inheritance the ability to create a new class
  from an existing class
• Example car

2
Things JavaScript Cant Do

• JavaScript doesnt have any graphical abilities
• It cant read or write files on the client
  machine
• No multithreading capabilities are built into
  JavaScript
• JavaScript supports networking only as it is
  involved in downloading the contents of specified
  HTML pages from URLs
• JavaScript is not Java

3
Features of JavaScript

• Control browser features
• Modify document appearance
• Modify document content
• Store and use information about user
• Interact with applets
• Manipulate images
• React to state of browser and client system

4

• Compare Figure 13.1 to Figure 13.2
• ltHTMLgt
• ltHEADgt
• ltSCRIPT type"text/javascript"gt
• // lt!-- Protection from older browsers
• // This function will display the famous phrase
  "Hello World"
• //
• function Hello()
• var OutputString "ltCENTERgtltBIGgtltIgtltBgtHello
  World lt/Bgtlt/Igtlt/BIGgtlt/CENTERgt"
• document.writeln(OutputString)
• // --gt
• lt/SCRIPTgt
• ltTITLEgtMy First Functionlt/TITLEgt
• lt/HEADgt
• ltBODY style"background-color FFFFCC"gt
• ltH1gtThe Output from the Hello() functionlt/H1gt
• ltSCRIPT type"text/javascript"gt
• //lt!-- Protection starts

5

• ltSCRIPTgtscript(s)lt/SCRIPTgt
• Description encloses the actual elements of the
  scripting language
• Attributes src, type, language, etc.
• Special note Although the nomianl contents of
  this container are JavaScript commands, Web
  weavers often include commands that generate HTML
  code as well
• src
• ltSCRIPT srcnearscript.jsgt
• If you want to use a function or script from an
  external file, you need to specify the URL of the
  JavaScript file as the argument to the src
• This source file should contain no HTML code,
  only JavaScript

6

• type
• ltSCRIPT typetext/javascriptgt
• lt/SCRIPTgt
• The type attribute should always be used with
  ltSCRIPTgt
• Basic Programming Structures
• Sequences A sequence is simply a set of
  statements that are executed one after the other,
  in the order they appear in the program
• Selection This structure allows us to create
  code that can respond to a variety of conditions
• Iteration Groups of statements that are iterated

7

• Examples
• Figure 13.6 for showing a coding sequence
• Figure 13.5 for showing an IF/ELSE block
• Change Figure 13.6 for showing of iteration
• ltSCRIPTgt
• //lt!-- Protect from older browsers and Mosaic
• for (var count10 countgt1 count--)
• document.writeln("Value of count
  "count"ltBRgt")
• document.writeln("We have ignition......We have
  liftoff!")
• // --gt
• lt/SCRIPTgt

8
Object-Oriented Concepts in JavaScript

• It is based on a set of specialized entities
  called objects
• Every object has properties and methods
• Properties are attributes of the object, like the
  color of the text, and background of a document
• Methods are predefined functions that manipulate
  data, like the writeln()

9

• The Date Object
• Figure 13.8 with the date() object
• The difference between CGI script and JavaScript
• The Document Object
• Figure 13.10 demonstrating the document.lastModifi
  ed property
• The Window Object
• Figure 13.11 demonstrating for status bar