How to get anchor text/href on click using jQuery?

Question

Consider I have an anchor which looks like this

 

     
         ~/Resumes/Res         


        

      

Answer 1

Without jQuery:

You don't need jQuery when it is so simple to do this using pure JavaScript. Here are two options:

• Method 1 - Retrieve the exact value of the href attribute:

  Select the element and then use the .getAttribute() method.

  This method does not return the full URL, instead it retrieves the exact value of the href attribute.

  var anchor = document.querySelector('a'),
      url = anchor.getAttribute('href');
  
  alert(url);

---

• Method 2 - Retrieve the full URL path:

  Select the element and then simply access the href property.

  This method returns the full URL path.

  In this case: http://stacksnippets.net/relative/path.html.

  var anchor = document.querySelector('a'),
      url = anchor.href;
  
  alert(url);

---

As your title implies, you want to get the href value on click. Simply select an element, add a click event listener and then return the href value using either of the aforementioned methods.

var anchor = document.querySelector('a'),
    button = document.getElementById('getURL'),
    url = anchor.href;

button.addEventListener('click', function (e) {
  alert(url);
});

Click me!