且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

this.href vs $(this).attr('href')

更新时间:2022-10-14 22:22:13

普通Javascript中的 href 属性将附加语义。它返回链接将导致的目标URL。它的编写方式无关紧要(绝对或相对URL)。



当你使用 $(this).attr(href时)您正在直接检索 href 属性的值,就像任何其他属性一样,因此它将返回HTML中呈现的确切值。 / p>

对于你的情况,***使用 $(this).attr(href)



如果您不想使用jQuery,还有另一种解决方案,只使用普通的JavaScript:

  this.getAttribute('href')


After reading this article net.tutsplus.com/tutorials/javascript-ajax/14-helpful-jquery-tricks-notes-and-best-practices/ I came to conclusion that using this.href is more efficient.

However, when I tried to use it on one of my projects, I saw that this.href returns not only href but also appends a url of a website. For example <a href="tab-04"></a>this.href will return http://example.com/abc/tab-04 and $(this).attr('href') will return only tab-04.

You can see an example here http://jsfiddle.net/UC2xA/1/.

$(this).attr('href') however returns exactly what I need and nothing more.

My question is this, how can I rewrite (or do what is necessary) this.href so that it would only return tab-04?

EDIT

Doug you are right on the money with

this.getAttribute('href')

The href property in plain Javascript will have the semantic attached to it. It returns the destination URL which the link will lead to. It doesn't matter how it was written (absolute or relative URLs).

When you use the $(this).attr("href") you are retrieving directly the value of href attribute just like any other attribute, so it will return the exact value rendered in the HTML.

For your case then, it's better to use $(this).attr("href")

If you don't want to use jQuery, there's yet another solution, using just plain JavaScript:

this.getAttribute('href')