/

HTML / CSS / JavaScript Tutorial

HTML Element: <a>

[this page | pdf | back links]

The HTML <a> or anchor element represents a hyperlink. It typically takes the form:

 

<a href="url">text</a>

 

or

 

<a href="url" target="x">text</a>

 

Here:

 

-        text is what the user sees

-        the href attribute contains the destination address of the link (i.e. where the browser goes to when the hyperlink is clicked). This could be a web address, e.g. http://www.nematrian.com/Introduction.aspx, a local link (to the same website as the page, e.g. introduction.aspx) or a bookmark within a resource

-        the target attribute indicates where to open the linked document

 

The attributes it can take (other than HTML global attributes and HTML event attributes) include:

 

Attribute

Description

More

download

Target will be downloaded when user clicks on hyperlink

Here

href

URL of page the link goes to

Here

hreflang

Language of linked document

Here

media

Specifies media / device linked document is optimised for

Here

rel

Relationship between current document and linked document

Here

target

Specifies where / how to open the linked document (or where to submit the form)

Here

type

Type of element

Here

 

To create or access such an element in JavaScript see here. The corresponding HTML DOM object supports standard DOM properties and methods, and additional properties with the same name and meaning as the attributes of the underlying HTML element referred to above (except perhaps the media attribute). It also has a text property which sets or returns the text content of the object. It also supports the hash, host, hostname, origin, password, pathname, port, protocol, search and username variants of the href attribute, see here for more details.

 

By default, an unvisited link is underlined and is usually blue, a visited link is underlined and purple and an active link is underlined and is usually purple, see here. However, it is possible to change these defaults by setting relevant CSS attributes.

 

EXAMPLE:


HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head></head>
<body>
Created using HTML:<br>
<a href="http://www.nematrian.com">link to www.nematrian.com</a>
<br><br>Created using JavaScript:<br>
<span id="element"></span>

<script>
var x = document.createElement("A");
x.href = "http://www.nematrian.com";
x.textContent = "link to www.nematrian.com";
// or use x.text = "link to www.nematrian.com";
document.getElementById("element").appendChild(x);
</script>

</body>
</html>


NAVIGATION LINKS
Contents | Prev | Next | HTML Elements


Desktop view | Switch to Mobile