JavaScript 1.2: added |
A
tag or calling the String.anchor
method. The JavaScript runtime engine creates an Anchor
object corresponding to each A
tag in your document that supplies the NAME
attribute. It puts these objects in an array in the document.anchors
property. You access an Anchor
object by indexing this array.
To define an anchor with the String.anchor
method:
theString.anchor(nameAttribute)where:
theString | |
nameAttribute |
A
tag, use standard HTML syntax. If you specify the NAME
attribute, you can use the value of that attribute to index into the anchors
array.
Anchor
object is also a Link
object, the object has entries in both the anchors
and links
arrays.
Property |
Description
|
|
|
The vertical position of the anchor's top edge, in pixels, relative to the top edge of the document. |
---|
watch
and unwatch
methods from Object
.
<A NAME="javascript_intro"><H2>Welcome to JavaScript</H2></A>If the preceding anchor is in a file called
intro.html
, a link in another file could define a jump to the anchor as follows:
<A HREF="intro.html#javascript_intro">Introduction</A>Example 2: anchors array. The following example opens two windows. The first window contains a series of buttons that set
location.hash
in the second window to a specific anchor. The second window defines four anchors named "0," "1," "2," and "3." (The anchor names in the document are therefore 0, 1, 2, ... (document.anchors.length-1).) When a button is pressed in the first window, the onClick
event handler verifies that the anchor exists before setting window2.location.hash
to the specified anchor name.
link1.html
, which defines the first window and its buttons, contains the following code:
<HTML>
<HEAD>
<TITLE>Links and Anchors: Window 1</TITLE>
</HEAD>
<BODY>
<SCRIPT>
window2=open("link2.html","secondLinkWindow",
"scrollbars=yes,width=250, height=400")
function linkToWindow(num) {
if (window2.document.anchors.length > num)
window2.location.hash=num
else
alert("Anchor does not exist!")
}
</SCRIPT>
<B>Links and Anchors</B>
<FORM>
<P>Click a button to display that anchor in window #2
<P><INPUT TYPE="button" VALUE="0" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="1" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="2" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="3" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="4" NAME="link0_button"
onClick="linkToWindow(this.value)">
</FORM>
</BODY>
</HTML>
link2.html
, which contains the anchors, contains the following code:
<HTML>
<HEAD>
<TITLE>Links and Anchors: Window 2</TITLE>
</HEAD>
<BODY>
<A NAME="0"><B>Some numbers</B> (Anchor 0)</A>
<UL><LI>one
<LI>two
<LI>three
<LI>four</UL>
<P><A NAME="1"><B>Some colors</B> (Anchor 1)</A>
<UL><LI>red
<LI>orange
<LI>yellow
<LI>green</UL>
<P><A NAME="2"><B>Some music types</B> (Anchor 2)</A>
<UL><LI>R&B
<LI>Jazz
<LI>Soul
<LI>Reggae
<LI>Rock</UL>
<P><A NAME="3"><B>Some countries</B> (Anchor 3)</A>
<UL><LI>Afghanistan
<LI>Brazil
<LI>Canada
<LI>Finland
<LI>India</UL>
</BODY>
</HTML>
Link
name
property reflects the value of the NAME
attribute.
alert("The first anchor is " + document.anchors[0].name)
text
property specifies the string that appears within the A
tag.
alert("The text of the first anchor is " + document.anchors[0].text)
Anchor.y
Anchor.x
Last Updated: 05/28/99 11:58:58