[jQuery] Re: How do I get the actual HREF of a link?

I've used this a hundred times:

$('#testlink').attr('href');

Don't make jQuery more complicated than it has to be.

-- Sean

On Jan 26, 7:32 am, Karl Swedberg <k...@englishrules.com> wrote:
> On Jan 26, 2009, at 12:56 AM, jQuery Lover wrote:
>
>
>
> > You can also try this:
>
> > $('#testlink')[0].getAttribute('href');
>
> > Returns whatever is in your href...
>
> Actually, in IE, where I'm guessing the problem is occurring, you need  
> to set the iFlags argument to 2 in order to get the actual value of  
> the href attribute.
>
>  From MSDN [1]:
>
> iFlags      Optional. Integer that specifies one or more of the  
> following flags:
> 0 Default. Performs a property search that is not case-sensitive, and  
> returns an interpolated value if the property is found.
> 1 Performs a case-sensitive property search. To find a match, the  
> uppercase and lowercase letters in sAttrName must exactly match those  
> in the attribute name. If the iFlags parameter for getAttribute is set  
> to 1 and this option is set to 0 (default), the specified property  
> name might not be found.
> 2 Returns the value exactly as it was set in script or in the source  
> document.
>
> [1]http://msdn.microsoft.com/en-us/library/ms536429(VS.85).aspx
>
> In this case, it would be:
>
> $('#testlink')[0].getAttribute('href', 2);
>
> One more reason to just use the jQuery method -- so we don't have to  
> worry about such cross-browser silliness.
>
> --Karl
>
> ____________
> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
>
>
> > On Mon, Jan 26, 2009 at 7:14 AM, Jumpfroggy  
> > <rocketmonk...@gmail.com> wrote:
>
> >> Here's the short version:
> >> I have a link:
> >>   <a id="testlink" href="page.html">page.html</a>
>
> >> But when I do this:
> >>   alert($('#testlink')[0].href);
>
> >> I get this:
> >>  http://localhost/page.html
>
> >> How do I get the *actual* HREF of the link ("page.html"), and not the
> >> mangled version?
>
> >> Thanks!
>
> >> ----------
>
> >> The long version:
>
> >> I have a few links in HTML:
> >>   <a href="/page1.html">/page1.html</a>
> >>   <a href="http://localhost/page1.html">http://localhost/page1.html</
> >> a>
> >>   <a href="http://localhost:80/page1.html">http://localhost:80/
> >> page1.html</a>
> >>   <a href="http://localhost/page2.html">http://localhost/page2.html</
> >> a>
> >>   <a href="http://www.google.com/page1.html">http://www.google.com/
> >> page1.html</a>
>
> >> When I do this:
> >>   $("[href]").each(function() {
> >>       var matches = $("[href='" + this.href + "']");
> >>       console.log("Searching for HREF \"" + this.href + "\", text
> >> \"" + $(this).html() + "\"" );
> >>       matches.each(function() {
> >>           console.log("Found: HREF \"" + this.href + "\", text \"" +
> >> $(this).html() + "\"" );
> >>       });
> >>   });
>
> >> I get this:
> >>   Searching for HREF "http://localhost/page1.html", text "/
> >> page1.html"
> >>   Found: HREF "http://localhost/page1.html", text "http://localhost/
> >> page1.html"
> >>   Searching for HREF "http://localhost/page1.html", text "http://
> >> localhost/page1.html"
> >>   Found: HREF "http://localhost/page1.html", text "http://localhost/
> >> page1.html"
> >>   Searching for HREF "http://localhost/page1.html", text "http://
> >> localhost:80/page1.html"
> >>   Found: HREF "http://localhost/page1.html", text "http://localhost/
> >> page1.html"
> >>   Searching for HREF "http://localhost/page2.html", text "http://
> >> localhost/page2.html"
> >>   Found: HREF "http://localhost/page2.html", text "http://localhost/
> >> page2.html"
> >>   Searching for HREF "http://www.google.com/page1.html", text
> >> "http://www.google.com/page1.html"
> >>   Found: HREF "http://www.google.com/page1.html", text "http://
> >>www.google.com/page1.html"
>
> >> The problem is that elem.href is returning a mangled version of the
> >> HREF, but the [href='...'] selector requires the URL exactly as it is
> >> written in the HTML.  So when an element has "/page.html" as it's
> >> HREF, doing elem.href returns "http://localhost/page.html" instead.
> >> So to search for the "/page.html" HREF, I have to search for:
> >>   [href='page.html']
> >>   [href='/page.html']
> >>   [href='http://localhost/page.html']
> >>   [href='http://localhost:80/page.html']
> >>   [href='https://localhost/page.html']
> >>   [href='https://localhost:443/page.html']
>
> >> Where "localhost" and "80" must be determined by javascript at  
> >> runtime
> >> to reflect the current server and port.  Also, the "/page.html" and
> >> "page.html" are not comprehensive.  The javascript would also have to
> >> check for all permutations of "../page.html", "folder/../page.html",
> >> etc.  The root of the problem here is this:  how can I get the
> >> *actual* HREF of a link via javascript, and not the mangled version?