The IWDN

Advanced Search





You are not logged in.

IWDN Forum Index > Web Development > Web Design, Structure and Style >> Target Not Allowed in XHTML - Using JavaScript

Reply
 
Thread Tools
Old April 27th, 2007, 21:19   #1
Corey Bryant's Avatar
Corey Bryant
IWDN Admin
 
Join Date: Nov 2004
Location: Castle Rock, CO
Posts: 2,187
Target Not Allowed in XHTML - Using JavaScript

Working off BigBison's post in since target is not allowed, I started to mess with my limited knowledge of JavaScript and came up with
Code:
function externalLinks() {
 if (!document.getElementsByTagName) return;
 var anchors = document.getElementsByTagName("a");
 for (var i=0; i<anchors.length; i++) {
  if (!anchors[i].getAttribute("href").match(("example")))
    {anchors[i].target = "_blank";}
        }
}
window.onload = externalLinks;
to also be able to use absolute links for your own domain (www.example.com) and it open in the same window. But if you use http://www.iwdn.net, it would open in a new window.

This seems to work in Internet Explorer 7.0 but not in Firefox 2.0. Can someone get it to work properly or is it not possible?

Thanks!
__________________
Corey
My Merchant Account Blog | Expression Web Blog
Corey Bryant is offline   Reply With Quote
Old April 27th, 2007, 21:33   #2
Gerrit's Avatar
Gerrit
E=mc˛
 
Join Date: Jan 2005
Location: Puerto Rico
Posts: 677
I've been using this for some time now:
Code:
function externalLinks() {
 if (!document.getElementsByTagName) return;
 var anchors = document.getElementsByTagName("a");
 for (var i=0; i<anchors.length; i++) {
   var anchor = anchors[i];
   if (anchor.getAttribute("href") && 
       anchor.getAttribute("rel") == "external")
     anchor.target = "_blank";
 }
}
window.onload = externalLinks;
A link to a page to open in a new window looks like this:
Code:
<a href="http://www.domain.com" rel="external">Link text</a>
I didn't code it - I found it somewhere.
__________________
Gerrit

Computer Newbies Help Forum
Gerrit is offline   Reply With Quote
Old April 27th, 2007, 21:53   #3
Corey Bryant's Avatar
Corey Bryant
IWDN Admin
 
Join Date: Nov 2004
Location: Castle Rock, CO
Posts: 2,187
That one was what I was using as well (I was Strict but now I need to be Transitional), but the code BigBison created, you no longer need to even use
Code:
rel="external"
I am using that one currently on a site but also needing to use absolute hyperlinks on the same domain name and was hoping to be able to get around using the rel attribute
__________________
Corey
My Merchant Account Blog | Expression Web Blog
Corey Bryant is offline   Reply With Quote
Old April 27th, 2007, 22:01   #4
Gerrit's Avatar
Gerrit
E=mc˛
 
Join Date: Jan 2005
Location: Puerto Rico
Posts: 677
Ah OK..
With this one you can use absolute links without a problem as you know. The rel="external" thingy doesn't bother me.
__________________
Gerrit

Computer Newbies Help Forum
Gerrit is offline   Reply With Quote
Old April 28th, 2007, 01:15   #5
inimino
IWDN Core Team
 
Join Date: Oct 2004
Location: Colorado, US
Posts: 1,174
Send a message via ICQ to inimino Send a message via AIM to inimino
Code:
  if (!anchors[i].getAttribute("href").match(("example")))
The trouble here is that this matches only when the href attribute contains "example", which it often won't.
HTML Code:
<a href="page_2.html">next page</a> this will open as an external link.
There is a bug in IE, where getAttribute('href') returns the absolute URL rather than the actual href attribute, which is why this code works in that browser, but according to the DOM the getAttribute() function must return the actual value of the attribute, reasonably enough.

There are two ways to work around IE's incorrect implementation of the standard, one is to use a magical second argument to getAttribute(), which means, "if you are IE please follow the standard," and the other would be to use .href instead of .getAttribute('href'). The .href property returns the absolute URL in every case according to DOM 2 HTML, and is implemented correctly even by IE.

So either of these might work:
Code:
if(anchors[i].getAttribute('href',2).match('^http://'))
if(!anchors[i].href.match('example.com/'))
Matching against ^http:// (the ^ matches the beginning of the string) is the cleanest and doesn't need to be modified to work on other sites. It won't work, of course, if there are absolute URLs to other pages on the same site.

EDIT after reading post #3:
Since you have absolute URLs on the same domain, unless you can change them, you'll have to use .href and look for the actual domain.
inimino is offline   Reply With Quote
Old April 28th, 2007, 12:52   #6
Corey Bryant's Avatar
Corey Bryant
IWDN Admin
 
Join Date: Nov 2004
Location: Castle Rock, CO
Posts: 2,187
Thanks!
Code:
function externalLinks() {
 if (!document.getElementsByTagName) return;
 var anchors = document.getElementsByTagName("a");
 for (var i=0; i<anchors.length; i++) {
  if(!anchors[i].href.match('loudworx.com/'))
    {anchors[i].target = "_blank";}
        }
}
window.onload = externalLinks;
seems to have worked. I know it was easy enough to add that
Code:
rel="external"
but on some sites it was easier to hopefully come up with something else
__________________
Corey
My Merchant Account Blog | Expression Web Blog
Corey Bryant is offline   Reply With Quote
Reply


Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump