• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint

HTML Elements

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):

            Using the eval Function 
        <SCRIPT LANGUAGE="JavaScript"> 
            function evaluator()
					= eval(document.forms[0].expression.value)
            // --> 

        <H1>Using the eval Function</H1> 
            <INPUT TYPE="TEXT" NAME="expression">
					<INPUT TYPE="BUTTON" ONCLICK="evaluator()" VALUE="  =  ">
					<INPUT TYPE="TEXT" NAME="result"> 


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.12—some 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 

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint