Inside JavaScript

Since Internet Explorer 4.0, all HTML elements in a web page are regarded as browser objects as well, just like the others we've been discussing in this chapter. For example, we've already seen this code in this and the preceding chapter, where I'm treating a text field named result as an object, and using its value property to assign text to that text field (see Figure 3.15):

<HTML> <HEAD> <TITLE> Using the eval Function </TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function evaluator() { document.forms[0].result.value = eval(document.forms[0].expression.value) } // --> </SCRIPT> </HEAD> <BODY> <H1>Using the eval Function</H1> <FORM> <INPUT TYPE="TEXT" NAME="expression"> <INPUT TYPE="BUTTON" ONCLICK="evaluator()" VALUE=" = "> <INPUT TYPE="TEXT" NAME="result"> </FORM> </BODY> </HTML>

Treating all HTML elements as objects makes for an immense number of new objects, all with their own properties, methods , and events. You can see all the elements supported in HTML 4.01, and what they do, in Table 4.11.

Table 4.11. The HTML 4.10 Elements

Element

Means

<!-->

Comments and server-side includes

<!DOCTYPE>

Starting an HTML page

<A>

Creating a hyperlink or anchor

<ABBR>

Displaying abbreviations

<ACRONYM>

Displaying acronyms

<ADDRESS>

Displaying an address

<APPLET>

Embedding applets in web pages

<AREA>

Creating clickable regions in image maps

<B>

Creating bold text

<BASE>

Setting the base for hyperlinks

<BASEFONT>

Setting the base font

<BDO>

Overriding the bidirectional character algorithm

<BGSOUND>

Adding background sounds

<BIG>

Creating big text

<BLINK>

Making text blink

<BLOCKQUOTE>

Indenting quotations

<BODY>

Creating a web page's body

<BR>

Inserting line breaks

<BUTTON>

Creating a customizable button

<CAPTION>

Creating a table caption

<CENTER>

Centering text

<CITE>

Creating a citation

<CODE>

Displaying program code

<COL>

Defining a column

<COLGROUP>

Grouping and formatting columns

<DD>

Creating definition list definitions

<DEL>

Displaying text as deleted

<DFN>

Defining new terms

<DIR>

Deprecated list

<DIV>

Formatting block text

<DL>

Creating definition lists

<DT>

Creating definition list terms

<EM>

Emphasizing text

<EMBED>

Embedding multimedia and plug-ins in a web page

<FIELDSET>

Grouping form elements

<FONT>

Specifying a font

<FORM>

Creating HTML forms

<FRAME>

Creating frames

<FRAMESET>

Containing frames

<H1> through <H6>

Creating web page headings

<HEAD>

Creating a web page's head

<HR>

Creating horizontal rules

<HTML>

Starting an HTML page

<I>

Creating italic text

<IFRAME>

Creating inline or floating frames

<ILAYER>

Creating inline layers

<IMG>

Adding an image to a web page

<INPUT TYPE=BUTTON>

Creating buttons

<INPUT TYPE=CHECKBOX>

Creating check boxes

<INPUT TYPE=FILE>

Creating file input for a form

<INPUT TYPE=HIDDEN>

Creating hidden data

<INPUT TYPE=IMAGE>

Creating image submit buttons

<INPUT TYPE=PASSWORD>

Creating password controls

<INPUT TYPE=RADIO>

Creating radio buttons

<INPUT TYPE=RESET>

Creating reset buttons

<INPUT TYPE=SUBMIT>

Creating submit buttons

<INPUT TYPE=TEXT>

Creating text fields

<INS>

Displaying inserted text

<ISINDEX>

Using an index

<KBD>

Displaying text the user is to type

<KEYGEN>

Processing secure transactions

<LABEL>

Labeling form elements

<LAYER>

Arranging text in layers

<LEGEND>

Creating a legend for form elements

<LI>

Creating list items

<LINK>

Setting link information

<MAP>

Creating client-side image maps

<MARQUEE>

Displaying text in a scrolling marquee

<MENU>

Deprecated list

<META>

Giving more information about your web page

<MULTICOL>

Creating columns

<NOBR>

Avoiding line breaks

<NOEMBED>

Handling browsers that don't handle embedding

<NOLAYER>

Handling browsers that don't handle layers

<NOSCRIPT>

Handling browsers that don't handle JavaScript

<OBJECT>

Placing an object into a web page

<OL>

Creating ordered lists

<OPTGROUP>

Creating a select control item group

<OPTION>

Creating a select control item

<P>

Creating paragraphs

<PARAM>

Specifying a parameter

<PRE>

Displaying preformatted text

<Q>

Displaying short quotations

<RT>

Creating ruby text

<RUBY>

Creating rubies

<S> and <STRIKE>

Striking text out

<SAMP>

Displaying sample program output

<SCRIPT>

Creating a script

<SELECT>

Creating a select control

<SERVER>

Running server-side JavaScript scripts

<SMALL>

Creating small text

<SPACER>

Controlling horizontal and vertical spacing

<SPAN>

Formatting inline text

<STRONG>

Strongly emphasizing text

<STYLE>

Using embedded style sheets

<SUB>

Creating subscripts

<SUP>

Creating superscripts

<TABLE>

Creating a table

< TBODY >

Creating a table body when grouping rows

<TD>

Creating table data

<TEXTAREA>

Creating text areas

<TFOOT>

Creating a table foot when grouping rows

<TH>

Creating table headings

<THEAD>

Creating a table head when grouping rows

<TITLE>

Giving a web page a title

<TR>

Creating a table row

<TT>

Creating "teletype" text

<U>

Underlining text

<UL>

Creating unordered lists

<VAR>

Displaying program variables and arguments

<WBR>

Allowing word breaks

<XML>

Accessing XML data with an XML data island

It would be very difficult to list and discuss all the properties, methods, and events for each of the many elements you see in Table 4.11 in this book, because we would be talking about well more than 10,000 different items. However, there's a great deal of overlap among these items, because all these HTML elements support what I'll call JavaScript's core set of HTML properties, methods, and events. You can find those core properties, methods, and events in Table 4.12. We'll be covering them in the next two chapters (in fact, there are some exceptions to the core properties, methods, and events in Table 4.12some HTML elements don't support some of these properties, methods and events, and I'll note them on a case-by-case basis in the next two chapters).

Table 4.12. Core HTML Properties, Methods, and Events

Properties

Methods

Events

accessKey

addBehavior

onactivate

all

addEventListener

onbeforeactivate

attributes

appendChild

onbeforecopy

begin

applyElement

onbeforecut

behaviorUrns

attachEvent

onbeforedeactivate

canHaveChildren

blur

onbeforeeditfocus

canHaveHTML

clearAttributes

onbeforepaste

childNodes

click

onblur

children

cloneNode

onclick

className

componentFromPoint

oncontextmenu

clientHeight

contains

oncontrolselect

clientLeft

detachEvent

oncopy

clientTop

dispatchEvent

oncut

clientWidth

dragDrop

ondblclick

contentEditable

fireEvent

ondeactivate

currentStyle

focus

ondrag

dataFld

getAdjacentText

ondragend

dataFormatAs

getAttribute

ondragenter

dataSrc

getAttributeNode

ondragleave

dir

getBoundingClientRect

ondragover

disabled

getClientRects

ondragstart

document

getElementsByTagName

ondrop

end

getExpression

onfilterchange

filters

hasChildNodes

onfocus

firstChild

insertAdjacentElement

onfocusin

hasMedia

insertAdjacentHTML

onfocusout

height

insertAdjacentText

onhelp

hideFocus

insertBefore

onkeydown

id

item

onkeypress

innerHTML

mergeAttributes

onkeyup

innerText

normalize

onlosecapture

isContentEditable

releaseCapture

onmousedown

isDisabled

removeAttribute

onmouseenter

isMultiLine

removeAttributeNode

onmouseleave

isTextEdit

removeBehavior

onmousemove

lang

removeChild

onmouseout

language

removeEventListener

onmouseover

lastChild

removeExpression

onmouseup

length

removeNode

onmousewheel

localName

replaceAdjacentText

onmove

namespaceURI

replaceChild

onmoveend

nextSibling

replaceNode

onmovestart

nodeName

scrollIntoView

onpaste

nodeType

setActive

onpropertychange

nodeValue

setAttribute

onreadystatechange

offsetHeight

setAttributeNode

onresize

offsetLeft

setCapture

onresizeend

offsetParent

setExpression

onresizestart

offsetTop

supports

onselectstart

offsetWidth

swapNode

ontimeerror

onOffBehavior

tags

 

outerHTML

urns

 

outerText

   

ownerDocument

   

parentElement

   

parentNode

   

parentTextEdit

   

prefix

   

previousSibling

   

readyState

   

recordNumber

   

runtimeStyle

   

scopeName

   

scrollHeight

   

scrollLeft

   

scrollTop

   

scrollWidth

   

sourceIndex

   

style

   

syncMaster

   

tabIndex

   

tagName

   

Категории