Listen for attribute change in link?

Question

I am using s3 library that directly uploads content from browser and returns the content inside a link tag. Now i want to display the url in link as an image. The current code i have working so far

var icon = document.getElementById("selectLogo");

icon.addEventListener("click",(evt)=> {
    evt.preventDefault();
    var element = document.getElementsByClassName("file-input")[0];
    element.click();
});

var icon_link = document.getElementsByClassName("file-link")[0];

icon_link.addEventListener("onchange",(evt)=> {
    evt.preventDefault();
    console.log(icon_link);
});

where icon my img tag which triggers a click on upload button. The problem i am facing is with icon_link which is an link tag. What i want is to listen for href attribute change and update image accordingly . How can that be possible all using vanilla js and no external dependencies ?

the issue was not that. i accedentally changed cases while copying code. the upload event is triggering . — georoot, Sep 16 '17 at 17:40
`change` event won't be fired by the change in `href` attribute. — ibrahim mahrir, Sep 16 '17 at 17:43

score 1 · Answer 1 · answered Sep 16 '17 at 17:43

1

You need a mutation observer to watch for attribute changes on a DOM node. See https://stackoverflow.com/a/41425087/459966

answered Sep 16 '17 at 17:43

Aaronius

4,936
6
31
40

You should close as dupe. This is not an answer. – ibrahim mahrir Sep 16 '17 at 17:45
I don't have enough rep points. Feel free to though. – Aaronius Sep 16 '17 at 17:47

Listen for attribute change in link?

1 Answers1