I've got problem with getting this text from href. I'm working on dom and I'd like to get text from this href:

<div class='xx'>
  <a href='zz' class='button>
...

I was trying to do sth like that:

document.getElementById(".xx").getAttribute("href")

But it's not working properly

I've got problem with getting this text from href. I'm working on dom and I'd like to get text from this href:

<div class='xx'>
  <a href='zz' class='button>
...

I was trying to do sth like that:

document.getElementById(".xx").getAttribute("href")

But it's not working properly

• javascript
• dom

Share Improve this question Follow asked Dec 19, 2017 at 14:32 SamantaSamanta 1111 silver badge11 bronze badge 3

• the href is another element, not an attribute. And ".xx" is a class selector, not an id selector. And what text? There's no text shown in your example. I suggest you take a beginner tutorial, because this looks like guesswork. – ADyson Commented Dec 19, 2017 at 14:34
• xx is a class not an ID. Read here: stackoverflow./questions/21436550/… – Turnip Commented Dec 19, 2017 at 14:34
• You are totally right! Comment deleted... – Tito Sanz Commented Dec 19, 2017 at 14:41

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 3

But it's not working properly

Because

• you don't have an element with id attribute .xx,
• .xx targets the div not the anchor

Also, your anchor tag's attribute class is not closed properly, also closing tag is not given either.

<div class='xx'>
  <a href='zz' class='button'>Some text</a>
</div>

you have a class so use the class selector itself using querySelector

document.querySelector( ".xx .button" ).getAttribute( "href" )

or simply

document.querySelector( ".xx .button" ).href;

getElementById will grab an element by that ID. You have an anchor (malformed albeit) with not an ID but a class. Secondly you are targeting the parent div. You should be targeting the tag using querySelector() instead. Then to get the href you'd use href.

const href = document.querySelector('.xx .button').href;

console.log(href);

<div class='xx'>
  <a href='zz' class='button'></a>
</div>

This works for me

document.getElementsByClassName("xx")[0].getElementsByTagName("a")[0].getAttribute("href")

The code below will get text from link:

var x = document.getElementsByClassName('xx')[0].getElementsByTagName("a")[0].getAttribute("href");

you can use id instead of class because class returns undefined value.and also you tried to get class using getby id

wrong:

document.getElementById(".xx").getAttribute("href")

function h()
{
alert(document.getElementById("button").href);
}

<a href='zz' id='button' onclick='h();'>
asd</a>

var yourhref = document.querySelector("div.xx a.button").href

yourhref holds your requested value. This is as precise as it gets using only the part of code you provided. If somewhere else on the page you have a div with class xx and a link with class button you are not gonna have a good time.

Solution - either have your targeted element or parent have UNIQUE id and then write a selection from there.