I ran across this article at SitePoint, which is very good. Basically, the concept is that while the target attribute is compliant in an XHTML Transitional world, it is exactly that. Transitional. Transitional doctypes allow us to go from deprecated doctypes to something more standard, such as XHTML Strict.

So, we either code according to the transitional spec now and change later or code in strict now and find a solution. I prefer the latter. So, at SitePoint they discussed and created a solution. Great. Basically, the rel attribute is the new standard and SitePoint created a JavaScript solution to make all links with the attribute of rel set to “external” open in an external or new window.

This short blurb only addresses modifying and using the prototype JavaScript foundation to rewrite the code. I rewrote the code and Voila! Here she be:

The Code

if (typeof $$ != "function" ) return;
$$('a[rel=external]').each(
function( lnk ){
lnk.setAttribute( "target", "_blank" );
}
);

Feel free to rip me off and take this code! P.S. I’m using Prototype 1.5.0_rc0

Comments

16 Comments

  1. Anders Tornblad said over 3 years ago

    Personally, I don’t like using JavaScript to force-feed obsolete attributes (such as target) to otherwise strictly valid markup. The article that you refer to seems to disagree on that point, but that’s life. =)

    The following article shows how to take this one step further, keeping accessibility and usability in focus:

    http://www.456bereastreet.com/archive/200610/opening_new_windows_with_javascript_version_12/

  2. Ben McNelly said over 3 years ago

    Right now its rare I do a strict site, even though they pass validation, I mainly make transitional CMS driven sites – In other words, the users WILL put font tags for blue comic sans @ 42px, and there is nothing I can do about it. But this is still useful info so thanks for sharing! I happen to agree that browser control of that sort should be left outside of xhtml.

    just my 1.3 cents….
    - Ben

  3. Rogie said over 3 years ago

    @Anders: My question for you is…how does this 456Berea street article keep accessibility and usability in focus? Is it that instead of JavaScript creation of the target attribute, it uses JavaScript instead?

  4. Anders Tornblad said over 3 years ago

    Well, first of all, there are no surprises. Opening new windows should always be up to the user, and never to the site that is visited. So if you are forced to do this by some client, you should add a warning – otherwise the user cannot tell that one link opens a new window, while other links do not.

    This has nothing to do with the target attribute, but rather shows that Roger at 456bereastreet has gone a few steps further in this script by adding that warning.

    Also, the scripts lets the user override the new window behavior through modifier keys, which could be described on the site.

    But, for the target attribute itself, it is just a matter of personal preference.

  5. Rogie said over 3 years ago

    @Anders: Good point. There are definitely some cases where I can see that forcing the new-window “catastrophe” can be useful. Imagine filling out a form and linking to a page…the user is almost done completing it, they click the link and blam! the data is lost. I’m not saying this is a great solution, but scenarios like these may need a different solution. Possibly a lightbox type scenario.

  6. Anders Tornblad said over 3 years ago

    The problem of navigating away from a form is not a big issue – click “Back”, and your fields are the way that you left them, provided that the site doesn’t contain obtrusive JavaScript that clears form fields from within the load event.

    Besides, most browsers support the beforeunload event, which lets the visitor confirm the action of leaving the page (and even closing the browser window).

  7. Rogie said over 3 years ago

    @Anders: As far as losing forms data, man you are right on. I feel like a flippin’ idiot. Oh, well, a humble web developer is a good web developer.

    I have one question for you. Do you feel that JavaScript behaviors should be done away from entirely?

  8. Anders Tornblad said over 3 years ago

    I’ll try to answer that one question with just one sentence:

    JavaScript should be the technology of choice for the “behavior enhancement tier” of any web-based architecture – not the “behavior tier”.

  9. alhaurin said over 3 years ago

    Look at all the posibilities of this “factory” of widgets RSS “beon” presents you:

    http://factory.beon4u.com/factory.aspx

    It´s great, isn´t it?

  10. Jonathan said over 3 years ago

    Thanks!

  11. Hillary said over 3 years ago

    I\’m love this great website. Many thanks guyt

  12. GeG said over 3 years ago

    Hi Rogie,

    as far as i remember, there is a xhtml strict compliant way to use the target attribute, but it was some time ago i used it, so i hope i remember correctly. Use this as doctype (it is your own document type, based on xhtml strict):

    and at http://yoursite.example.com/DTD/xhtml-target.dtd put this (here you include the target attribute, you just add the modularized target part of the w3.org doc type to the basic xhtml strict w3.org doc type):

    %xhtml-da
    tatypes.mod;]]>

    %xhtml-qname.
    mod;]]>

    %xhtml11.dtd;

    %xhtml-targe
    t.mod;]]>

    afaik this is the w3.org compliant way (see http://www.w3.org/TR/xhtml-modularization/Overview.html under 5.12)

    Cheers
    GeG

  13. GeG said over 3 years ago

    it seems that your site ate most parts of my xml :-(

    you can see at http://pastebin.com/f30b7548f what i mean

  14. Madis said over 2 years ago

    You could also use xhtml +mathml doctype, it has valid target for link, no javascript.

  15. Britney said over 2 years ago

    Nice site! Big thanx to webmaster!t

  16. Dan said over 2 years ago

    I generally use

    onclick="window.open(this.href)"

    right in the anchors, but it makes pretty good sense to bind something with rel=”external”

Sorry, the comment form is closed at this time.