An anchor (<a>...</a>) is a HTML element used to denote the resource location of content to load in a web browser. Anchor elements are defined by the <a> HTML element which accepts several attributes. The only required attributes are either name= or href=

Attributes

HREF

If the HREF attribute is present, the text between the opening and closing anchor elements becomes a hypertext link. If the link is selected the content of the location referenced by the hypertext link is loaded.

<a href="https://www.stackoverflow.com"></a>

HREF attributes can be defined with a fully qualified URI or simply to elements that exist within the already loaded content. In-page HREF values are specified by the HTML ID global attribute assigned to the targeted element and specified as the HREF attribute value.

<a href="#container"></a>

Other Valid HREF Values

• <A HREF="http://..."> Makes a link to another document located on a World Wide Web server.
• <A HREF="ftp://..."> Makes a link to an ftp site. Within an HTML document, normally a connection to an anonymous ftp site would be made. Recent browsers allows connection to private ftp sites. The Anchor would take the form ftp://jdoe@your.com. The browser would then prompt the user for a password.
• <A HREF="gopher://..."> Makes a link to a gopher server.
• <A HREF="mailto:..."> Activating such a link would bring up the browsers mailing dialog (or application associated with internet mail) allowing the user to send mail messages to the author of the document, or whoever's address follows the mailto attribute.
• <A HREF="news:..."> Makes a link to a newsgroup. Care should be taken in using such links because the author can not know what newsgroups are carried by the local news server of the user.
• <A HREF="newsrc:..."> Makes a link to a specific newsrc file.
• <A HREF="nntp://..."> Can be used to specify a different news server to that which the user may normally use. This is useful if you want to link to a newsgroup that the users local news server may not carry (see above).
• <A HREF="telnet://..."> Activating such a link would initiate a telnet session (using an external application) to the machine specified after the telnet:// label.
• <A HREF="wais://..."> Makes a link that connects to a specified WAIS index server.
• ` Displays the unrendered HTML source code of the content rather than rendering the code.
• <A HREF="nethelp:vendor/product:topic_id"> Only used when delivering on-line help via the NetHelp method in the NetHelp SDK.

NAME

If present, the NAME attribute allows the anchor to be the target of a link (another <A HREF...> element). The value of the NAME attribute is an identifier for the anchor. Identifiers are arbitrary strings but must be unique within the HTML document. Also, note that they are case sensitive within HTML documents and can not contain spaces.

<A NAME="coffee">Coffee</A> is an example of...

An example of this is <A HREF="#coffee">coffee</A>

TITLE

The TITLE attribute is for informational purposes only (unless used with a mailto: attribute). If present, the Title attribute should provide the title of the document whose address is given by the HREF attribute.

REL

The REL attribute gives the relationship(s) described by the hypertext link from the anchor to the target. The value should be a comma-separated list of relationship values. Values and their semantics will be registered by the HTML registration authority. The default relationship if none other is given is void. The REL attribute is only used when the HREF attribute is present.

REV

The REV attribute is the same as the REL attribute, but the semantics of the link type are in the reverse direction. A link from A to B with REL="X" expresses the same relationship as a link from B to A with REV="X". An anchor may have both REL and REV attributes.

URN

If present, the URN attribute specifies a uniform resource name (URN) for a target document. The format of URNs is still under discussion (since 1994) by various working groups of the Internet Engineering Task Force.

METHODS

The METHODS attributes of anchors and links provide information about the functions that the user may perform on an object. These are more accurately given by the HTTP protocol when it is used, but it may, for similar reasons as for the TITLE attribute, be useful to include the information in advance in the link. For example, the HTML user agent may chose a different rendering as a function of the methods allowed; for example, something that is searchable may get a different link appearance. The value of the METHODS attribute should be a comma separated list of HTTP methods supported by the object for public use.

TARGET

Browser windows can now have names associated with them. Links in any window can refer to another window by name. When the link is activated, the document referenced will appear in that named window. If the window is not already open, the browser will open and name a new window for you. Such an action is only supported by frames capable browsers.

The syntax for the targeted windows is:

<A HREF="url.html" TARGET="window_name">Link text</A>

The TARGET attribute can accept the following values:

window_name

The name of any window specified by a <FRAME> element, or by using the window.open scripting method. If a window_name is used which does not correlate to a previously defined window, then a new window is created and NAMEd according the the window name used in the TARGET attribute. This new window can then be referenced using its new name.

• _self Using this reserved keyword value, would cause any form feedback page to be loaded into the window that currently contains the form.
• _parent Using this reserved keyword value, would cause any form feedback page to be loaded into the window that is the parent of the window currently containing the form. i.e. if the form's window is part of a framed document, it would load into the window controlled by the <FRAMESET> element definitions that control the form's current window.
• _top Using the reserved keyword value would cause the form feedback page to be loaded into the topmost window, clearing any currently existing framed windows.
• _blank Using this reserved keyword value would cause the form feedback page to be loaded into a newly created window. Using this value is the same as using TARGET="window_name" where the window_name used is not a previously defined window. NOTE : Unlike using the window_name using a previously undefined window name, using _blank will not name the new window for future use.

ACCESSKEY

The ACCESSKEY attribute can be used to specify a shortcut key for the link (activated by pressing 'Alt' and the ACCESSKEY together - like standard Windows applications menu shortcuts). The ACCESSKEY setting does not have to be a character in the actual link text and the link text is not modified in any way to reflect that an ACCESSKEY has been defined for the link. A sensible way around this would be something like :

<A HREF="url.htm" ACCESSKEY="W">W<SPAN STYLE="{text-decoration:none}">hat's New</SPAN></A>

Which displays as : What's New. Alerting the user that there's something special about the 'W' in the link. Pressing 'Alt+W' would then activate the link. Note that more than one link in a document can use the same ACCESSKEY setting. If from the same document, an ACCESSKEY is re-used, the next ACCESSKEY enabled link in the document (in the order they appear) that uses the same setting will be activated. Unless you can guarantee where in the current document the user is, it makes sense to try and use unique ACCESSKEY settings for links. Also note that ACCESSKEY settings override those of the main Internet Explorer menus.

The ACCESSKEY attribute is Internet Explorer 4.0 and above specific.

LANGUAGE

The LANGUAGE attribute accepts values of Javascript or VBscript to explicitly set the scripting language used in any in-line scripts within the element. It attempts to set the language of all scripts relating to the element, but external script blocks (using the <SCRIPT> element) should contain their own LANGUAGE setting in the <SCRIPT> element. (See Javascript or Visual Basic Script topics for more information). LANGUAGE can be useful if you set multiple in-line event handling routines within an anchor element, to save using event="javascript:..." or event="vbscript:..." in each event handler, however, doing so would over-ride the LANGUAGE setting. For example, the following HTML fragment :

<A HREF="url.htm" onclick="javascript:return false">Link text</A>

'kills' the link, by cancelling the 'click' action. This could be simplified by using :

<A HREF="url.htm" LANGUAGE="Javascript" onclick="return false">Link text</A>

as the LANGUAGE element expressly sets the scripting language to be Javascript. The same 'idea' in Visual Basic Script could be :

<A HREF="url.htm" LANGUAGE="VBscript" onclick="window.event.returnvalue=false">Link text</A>

(Note the different syntax for event cancelling.)

INDEXSTRING and TOCSTRING

These attributes are specific for authoring on-line help/user assistance, employing Netscape NetHelp. For NetHelp help systems, the INDEXSTRING and TOCSTRING are used to define table of contents and index entries. NetHelp uses extensive scripting to dynamically create a table of content and an index for the files that make up the help system. To author a NetHelp system, table of contents entries and index keywords are defined in anchors within <Hx> elements. The INDEXSTRING and TOCSTRING attributes are then used to define the text that will appear in the table of contents and the keywords that will appear in the index. For example:

<H1>
<A NAME="intro" TOCSTRING="The HTMLib"></A>
</H1>
<H2>
<A NAME="introidx" TOCSTRING="Introduction to the HTMLib" INDEXSTRING="introduction^HTMLib^help">Introduction to the HTMLib</A>
</H2>

In a NetHelp system, this would result in a 'chapter' in the table of contents, headed "The HTMLib" (<H1> elements are interpreted as chapter headings by the NetHelp tools). The first section inside the "The HTMLib" chapter in the table of contents, would be entitled "Introduction to the HTMLib" (<H2> elements are interpreted as section headings, within a chapter heading by the NetHelp tools). Clicking on "The HTMLib" in the NetHelp generated table of contents would navigate to the anchor NAMEd intro and searching the NetHelp index with either "introduction", "HTMLib", or "help" would result in 'hits' which would navigate to the section NAMEd introidx. Clicking on the "Introduction to the HTMLib" entry in the table of contents would also navigate to the same section.

DATAFLD

The DATAFLD attribute can be used to specify a data column name from the Data source (see DATASRC) that the <A> is bound to. For more information on the DATAFLD attribute, see the Data Binding topic. Note that the data being taken from the Data Source will be used for the HREF attribute value if an anchor is data-bound. Therefore, having it receive data that isn't a valid URL would make the link useless.

DATASRC

The DATASRC attribute can be used to specify a data source that the is bound to. For more information on the DATASRC attribute, see the Data Binding topic.

LANG

The LANG attribute can be used to specify what language the <A> element is using. It accepts any valid ISO standard language abbreviation (for example "en" for English, "de" for German etc.) For more details, see the Document Localization section for more details.

CLASS

The CLASS attribute is used to specify the <A> as using a particular style sheet class. For example, external links throughout the HTMLib use a style class declared as:

<STYLE TYPE="text/css">
    .external {color : #0000FF}
</STYLE>

with the external links being referenced as:

<A CLASS="external" HREF="https://www.microsoft.com">https://www.microsoft.com/</A>

ID

The ID attribute can be used to either reference a unique style sheet identifier, or to provide a unique name for the <ADDRESS> element for scripting purposes. Any <ADDRESS> element with an ID attribute can be directly manipulated in script by referencing its ID attribute, rather than working through the All collection to determine the element. See the Scripting introduction topic for more information.

STYLE

As well as using previously defined style sheet settings, the <A> element can have in-line stylings attached to it. For example:

<A STYLE="color:#0000FF" HREF="https://www.microsoft.com">https://www.microsoft.com/</A>

would display exactly as the above example. See the Style Sheets section for more details about style sheet settings.

The <A> element style can also be controlled by using the Anchor pseudo-elements. Using a Style Sheet definition in the <STYLE> element, the pseudo-classes A:link, A:visited and A:active can be used to set the text style of links, visited links and active links respectively (just as the LINK, ALINK and VLINK attributes of the <BODY> element do for those browsers that do not support style sheets). Note however, that while Internet Explorer 4.0 currently supports the use of these pseudo-classes, it 'breaks' any scripting for the particular <A> element (either using an event handler in the element, or a separate script function referenced by the anchors ID attribute).

Scripting

Properties

Besides the Standard Dynamic HTML properties (i.e. className, document, id, innerHTML, innerText, isTextEdit, lang, language, offsetHeight, offsetLeft, offsetParent, offsetTop, offsetWidth, outerHTML, outerText, parentElement, parentTextEdit, sourceIndex, style, tagName and title), each link object (i.e. ) has the following properties, which are available for manipulation for every link in the document, either directly (within an in-line event handler, or via referencing of the anchor/links ID attribute) or via the Links array/collection. Note that most of the following properties are only supported by Internet Explorer 4.0's Dynamic HTML scripting model. Some properties and events are supported by Netscape (and earlier versions of Internet Explorer as each element creates an Anchor and/or a Link object (depending on whether it's <A HREF...> or <A NAME...>, whose properties and events are exposed through the Links array/collection and Anchor topic.

accessKey - (Internet Explorer 4.0+)

If the ACCESSKEY attribute (see above) is set for a link, then the accessKey property reflects the setting, otherwise it remains empty. It is possible to change a links accessKey property in script code.

datafld - (Internet Explorer 4.0+)

The dataFld property directly reflects the value of the DATAFLD attribute (see above). For more information on the DATAFLD attribute, see the Data Binding topic.

datasrc - (Internet Explorer 4.0+)

The dataSrc property directly reflects the value of the DATASRC attribute (see above). For more information on the DATASRC attribute, see the Data Binding topic.

hash - (Internet Explorer 3.0+, Netscape 2.0+)

The hash property reflects, or sets any 'bookmark' definitions within the link's HREF attribute. For example:

<A HREF="http://www.htmlib.com/intro.htm#contents" ID="ContentsLink">View the contents</A>
<SCRIPT LANGUAGE="VBScript">
strHash=ContentsLink.hash
</SCRIPT>

would make strHash have the value of contents.

host - (Internet Explorer 3.0+, Netscape 2.0+)

The host property is essentially a combination of the hostname (see below) and port (see below) properties. For the above example (for the hash property), the host property would be www.htmlib.com:80.

hostname - (Internet Explorer 3.0+, Netscape 2.0+)

The hostname property reflects, or sets the name of the computer identified in the HREF attribute. Using the above example (for the hash property), the hostname property would be www.htmlib.com.

href - (Internet Explorer 3.0+, Netscape 2.0+)

The href property reflects, or sets, the HREF attribute of the link. It is possible to change a link's href property through scripting.

Methods - (Internet Explorer 4.0+)

The Methods property reflects, or sets the links METHODS attribute (if set)

name - (Internet Explorer 3.0+, Netscape 2.0+)

The name property reflects the anchors NAME attribute.

pathname - (Internet Explorer 3.0+, Netscape 2.0+)

The pathname property reflects, or sets the full path to the target document, as given in the HREF attribute. For example:

<A HREF ="http://www.htmlib.com/html/Block Level Elements/address.htm" ID="ContentsLink">View the contents</A>
<SCRIPT LANGUAGE="VBScript">
strPathName=ContentsLink.pathname
</SCRIPT>

would give strPathName a value of html/Block Level Elements/address.htm.

port - (Internet Explorer 3.0+, Netscape 2.0+)

As mentioned above, the port property reflects, or sets the port setting (if given) in the HREF attribute (if set). If not port is specified in the HREF setting, then port 80 is assumed.

protocol - (Internet Explorer 3.0+, Netscape 2.0+)

The protocol property reflects, or sets the protocol of the HREF attribute (if set). For example:

<A HREF="https://www.microsoft.com/">Microsoft</A>
<A HREF="ftp://ftp.microsoft.com/">Microsoft (ftp)</A>

would have protocol properties of https:// and ftp:// respectively. For relative URLs in the HREF attribute, the protocol of the currently displayed document is used.

rel - (Internet Explorer 4.0+)

The rel property directly reflects, or sets the value of the REL attribute (if set).

rev - (Internet Explorer 4.0+)

The rev property directly reflects, or sets the value of the REV attribute (if set).

search - (Internet Explorer 3.0+, Netscape 2.0+)

The search property reflects, or sets any search strings appended to the URL given in the HREF attribute (if set). For example:

<A HREF= "http://www.htmlib.com/intro.htm?contents">Link text</A>

would have a search property value of contents

target - (Internet Explorer 3.0+, Netscape 2.0+)

The target property reflects, or sets the link's TARGET attribute (if set)

urn - (Internet Explorer 4.0+)

The urn property reflects, or sets the link's URN attribute (if set)

<A...> Methods

Besides the Standard Dynamic HTML methods (i.e. click, contains, getAttribute, insertAdjacentHTML, insertAdjacentText, removeAttribute, scrollIntoView and setAttribute), each Link object has the following methods, which are available for manipulation for every link/anchor in the document. Note that all of these methods are Internet Explorer (4.0 and above) specific. The Anchors array and Links array as supported by Netscape (and earlier versions of Internet Explorer) have a few Javascript specific methods, but this reference isn't a Javascript language reference, so they aren't detailed.

blur - (Internet Explorer 4.0+)

The blur method can be used to force the users focus away from the referenced <A>.

focus - (Internet Explorer 4.0+)

The focus method can be used to force the users focus onto the referenced <A>. For example:

Link1.focus()

would force the focus to the link, whose ID attribute is Link1.

<A...> Events

Besides the Standard Dynamic HTML events (i.e. onclick, ondblclick, ondragstart, onfilterchange, onhelp, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup and onselectstart), each <A...> element/object accepts the following events (both in separate script functions and within the element). Note that while some are supported in various versions of Netscape (via the anchors array/collection and links array/collection, depending on whether it's <A HREF...> or <A NAME...>, or both), most are Internet Explorer (4.0 and above) specific and are standard Dynamic HTML Events. Each event handler details its browser support. Also detailed are the various methods and properties accessible by script functions for anchors within the document.

onblur - (Internet Explorer 4.0+)

The onblur event can be used to execute script functions when the particular link loses the focus. Note the subtle difference between this event and the onmouseout event in that removing the mouse from being over the link does not lose the focus. This requires either programmatically forcing another object to receive the focus, or by the user manually passing the focus to another object or control in the document, or clicking the document background The example link below (containing ID="egOnBlurLink") executes the following script function when it loses the focus:

Sub changetext()
egOnBlurLink.innerHTML = "Now I've <STRONG>lost</STRONG> the focus"
End Sub

onfocus - (Internet Explorer 4.0+)

The onfocus event can be used to execute script functions when the particular link receives the focus. Note the subtle difference between this event and the onmouseover event in that passing the mouse over the link does not give it focus. This requires either programmatically forcing the link to receive the focus, or by using the 'tab' key to progress through the document links. The example link below (containing ID="egOnFocusLink") executes the following script function when it receives the focus:

Sub ReceivedFocus()
egOnFocusLink.innerHTML = "I received the <STRONG>focus</STRONG>"
End Sub

Which causes the link text to be replaced with the new message.

See also:

• The A element HTML 4.01 Specification
• Anchor definition in Wikipedia
• Uniform Resource Identifiers (URI): Generic Syntax
• URI definition in Wikipedia

Related tags:

canonical-link deep-linking hyperlink links path permalinks uri uri-scheme