How to reference id and get href of a link?

Question

Question : How to reference id of a link? See the attached image Click here

function insertButton(refresh = false) {
var to_match = 'a[class="';
var PAGE_TYPE = 0;

if (document.location.href == "https://www.youtube.com") {

How to reference id = "video-title-link"

var anchor_tag = document.getElementById("video-title-link");

There are 2 anchor tags* with the same class name. I would like to reference the id ="video-title-link"

  if(anchor_tag.hasAttribute('href="\/watch\?v=(\S+)"')){

    to_match = to_match.concat("yt-simple-endpoint style-scope ytd-rich-grid-video-renderer", '"]').getattribute('id ="video-title-link"');
    PAGE_TYPE = 1;

  } 

}

UPDATE : POLLING

const poller = setInterval(function(){  
    
  const anchor_tags = document.querySelectorAll('a[id="video-title-link"]'); 
  
    if(anchor_tags){
  
        for (index = 0; index < anchor_tags.length ; index++){
            
            console.log(anchor_tags[index].getAttribute('href'));
            
        }   
        
        clearInterval(poller);
        
    }   
    
}, 1000);

OUTPUT : Click here : href of each 'id'

Welcome to SO. Would you give us more information about, what exactly you need to do? — Rado, Sep 04 '20 at 13:16
You have to explain what you want to do here? What have you tried? on which event you want to get the href? — Naveen Chandra Tiwari, Sep 04 '20 at 13:18
Please include all code as text, not as pictures of text. Also explain how the HTML you show in that image relates to the JavaScript, and how you are planning on using that JavaScript. — Heretic Monkey, Sep 04 '20 at 13:18
If you just want the href of a link, you can grab it by using a querySelector, and then looking at the href: `document.querySelector('#classnamehere').href`. This will give you the full path of the href. — Robert Stefanic, Sep 04 '20 at 13:18
Note that unless you're writing this code for Google, `document.location.href` is unlikely to be "https://www.youtube.com" unless you're running code in the console or an extension. — Heretic Monkey, Sep 04 '20 at 13:19
@RobertStefanic - There are two tags with the same classname. I want the one which has 'href = "/watch?v=iKIhfmiy4II"? — prv.2k20, Sep 04 '20 at 13:37
Does this answer your question? [Get local href value from anchor (a) tag](https://stackoverflow.com/questions/15439853/get-local-href-value-from-anchor-a-tag) — Heretic Monkey, Sep 04 '20 at 14:01
@HereticMonkey - I should be able to reference the 2nd tag using this : to_match = to_match.concat("yt-simple-endpoint style-scope ytd-rich-grid-video-renderer", '"]'); — prv.2k20, Sep 04 '20 at 14:13
Was that a question? `to_match` is a string. It doesn't reference anything until you use it with `querySelector` or some other mechanism to select something in the DOM. The linked question's answers answer the question of how to get the `href` attribute of an anchor element. — Heretic Monkey, Sep 04 '20 at 14:19
@NaveenChandraTiwari - Can you have a look at it? I'll share the source code — prv.2k20, Sep 04 '20 at 16:40
@HereticMonkey - Can you have a look at it? I'll share the source code — prv.2k20, Sep 04 '20 at 16:42
Nah. You've changed the question and invalidated the answer, which is unfair to the answerer. Sharing the code is a requirement of the site, not something you withhold to get people to answer your question. — Heretic Monkey, Sep 04 '20 at 16:45

score 2 · Answer 1 · answered Sep 04 '20 at 13:22

You can use querySelector() and .getAttribute() to do this:

const element = document.querySelector(".yt-simple-endpoint")
const href = element.getAttribute("href");
console.log(href)

<a class="yt-simple-endpoint" href="https://example.com">Link</a>

How to reference id and get href of a link?

1 Answers1