Getting Along Without the Target Attribute

The target attribute for the A tag can be used to open a page in a new window (or tab), open a page in another frame, and open a page in a parent window.

The target attribute is not supported for DOCTYPE Strict HTML or XHTML pages. It is, however, still supported for DOCTYPE Transitional pages.

When a page is specified as Strict, coding a target attribute into the A tag will cause the page to fail validation.

If you must have Strict pages and you want the target functionality, here are two ways to implement similar functionality and still have the pages validate. Both methods use JavaScript.

1. Inserting the target attribute: Use JavaScript to insert the target attribute when the link is clicked. The target attribute can have any value it would have had if it were hard coded into the A tag (see HTML <a> target Attribute for legitimate target attribute values).

2. Simulating the target attribute: Use the JavaScript window.open() function to simulate an action of the target attribute. This can simulate any legitimate target attribute value.

For JavaScript-disabled browsers, no target attribute is inserted nor simulation created. Instead, the linked document is loaded in the current browser window.

The 2 methods are implemented similarly.

Method 1: Inserting the Target Attribute

Using JavaScript to insert a target attribute requires 2 things:

• An onclick attribute for the a tag.
• Some JavaScript.

The onclick attribute with its value is:

onclick="return InsertTargetAttribute(this,'_blank')"

The first function parameter this (no quotes) stays at it is. The second function parameter _blank (between single quotes) specifies the value for the target attribute.

Here is the code for an example link:

<a 
   href="//www.willmaster.com/library/" 
   onclick="return InsertTargetAttribute(this,'_blank')">
The Willmaster Library
</a>

And here is the JavaScript. No edits required.

<script type="text/javascript"><!--
function InsertTargetAttribute(thislink,target) {
thislink.target = target;
return true;
}
//--></script>

This link uses the above example link code and the JavaScript to insert a target attribute of "_blank".

The Willmaster Library

When the link is clicked, the InsertTargetAttribute() function is launched. The function sets the link's target attribute and then returns the value true. The value true tells the browser to go ahead and comply with the click.

Method 2: Simulating the Target Attribute

Using JavaScript to simulate a target attribute requires 2 things:

• An onclick attribute for the a tag.
• Some JavaScript.

The onclick attribute with its value is:

onclick="return SimulateTargetAttribute(this,'_blank')"

The first function parameter this (no quotes) stays at it is. The second function parameter _blank (between single quotes) specifies the value for the target attribute.

Here is the code for an example link:

<a 
   href="//www.willmaster.com/library/" 
   onclick="return SimulateTargetAttribute(this,'_blank')">
The Willmaster Library
</a>

And here is the JavaScript. No edits required.

<script type="text/javascript"><!--
function SimulateTargetAttribute(thishref,target) {
window.open(thishref.getAttribute("href"),target);
return false;
}
//--></script>

This link uses the above example link code and the JavaScript to simulate a target attribute of "_blank".

The Willmaster Library

When the link is clicked, the SimulateTargetAttribute() function is launched. The function opens the document with window.open() according to the value specified for the target and then returns the value false. The value false tells the browser to ignore any other actions associated with the click.

Which Method to Use

The following information can help you make a decision about which method to use.

Inserting the target attribute with JavaScript:

• Causes the browser to open the link like a normal link with a target attribute.

• The link referrer information is passed along normally.

• Unnoticed by popup blockers unless target attribute _blank is used and the blocker also blocks target="_blank".

Simulating the target attribute with JavaScript:

• Causes the browser to use the JavaScript window.open() function instead of the normal <a> tag link clicking mechanism.

• The link referrer information is unlikely to be passed along.

• May be blocked by popup blockers that block all window.open() use.

The methods provide target attribute functionality or simulate it. For the site visitor, both generally appear to work the same.

Will Bontrager