Get href from specific class

Question

I want to get specific links from my mail and open them in a new window.

I got this at the moment:

function OpenHrefsInNewWindow() {

//Get class name
var items = document.getElementsByClassName("confirm_link123");
var i = 0;

while(i < items.length)
{
    //Get a part from the specific link
    if (items[i].href.indexOf("confirm") > -1)
    {
        //If it does, open that URL in a new window.
        window.open(items[i].href, "_blank");
    }

    i++; //Increment i here.
}
}
OpenHrefsInNewWindow();

But every time I get a new mail the classname is changing. So I got different classnames every time. So how can I do, to search only for the beginning of the class and change it in my code?

Any solutions? (:

Do the class names follow a specific pattern? Is it always `confirm_link`? Are there other links that follow that pattern you don't want opened? — Luca Kiebel, Sep 14 '18 at 12:12
If the class name is changing, you need a different selector... We need more info on the element in question... You will need a `document.querySelectorAll` in that case. — Steven Spungin, Sep 14 '18 at 12:13
Try getQuerySelector like in this post: https://stackoverflow.com/questions/8714090/queryselector-wildcard-element-match — Javi Mollá, Sep 14 '18 at 12:14
@LucaKiebel So the confirm_link is every time diffrent and i got it 2 times and the second link i dont want to open just the first one. — faketalent, Sep 14 '18 at 12:15
We need more context in order to help you with the selector. I will post an answer so you can see this. — Steven Spungin, Sep 14 '18 at 12:18
@StevenSpungin what do you mean more context? Sorry im new in that :/ — faketalent, Sep 14 '18 at 12:21
`Context` means more details about your issue, such as the `html` that your script relates to. — Steven Spungin, Sep 14 '18 at 12:55

Steven Spungin · Answer 1 · 2018-09-14T20:07:29.513

0

Use class^= syntax to find classes that start with. To open multiple windows, generate a unique name instead of using '_blank'.

const items = document.querySelectorAll('*[class^="confirm_link"]')
console.log(items)

document.querySelector('button').addEventListener('click', ()=>{
      for(let i=0; i<items.length; i++){
        console.log(items[i])
        window.open(items[i].getAttribute('href'), 'window' + i)
      }
})

<div id='container'>
  <div class = 'foobar' >
    <a class='confirm_link1' href='http://www.google.com'></a>
    <a class='confirm_link2' href='http://www.google.com'></a>
    <a class='confirm_link3' href='http://www.google.com'></a>
  </div>
</div>

<button>click me</button>

Your example should look like this:

function OpenHrefsInNewWindow() {
  //Get class name
  const items = document.querySelectorAll('*[class^="confirm_link"]')
  var i = 0;

  while (i < items.length) {
    console.log('opening', items[i].getAttribute('href'))
    window.open(items[i].getAttribute('href'), "window" + i);
    i++; //Increment i here.
  }
}
OpenHrefsInNewWindow();

edited Sep 14 '18 at 20:07

answered Sep 14 '18 at 12:23

Steven Spungin

17,551
4
57
56

Yeah, but i just want to find the begining of my class if its "confirm_link" than its true, after that it will check the link if it contains "confirm". – faketalent Sep 14 '18 at 12:27
The class is changing but the beginning of the class is every time the same. – faketalent Sep 14 '18 at 12:29
Now it works thanks! But the code stop after it gets the first link and opened it why? – faketalent Sep 14 '18 at 12:39
Please explain 'the code stop'. Exception? Freeze? What does your console say? – Steven Spungin Sep 14 '18 at 12:40
I post the code then the code found one link its opening. But there are 3 more links that the should open. – faketalent Sep 14 '18 at 12:41
Do you have a popup blocker running? – Steven Spungin Sep 14 '18 at 12:42
No im not running a popup blocker. – faketalent Sep 14 '18 at 12:43
You need to use a unique window name to open. Check out updated answer. Keep in mind SO snippet will not open windows. – Steven Spungin Sep 14 '18 at 12:52
@faketalent For starters , you have `class*=` instead of `class^=` – Steven Spungin Sep 14 '18 at 18:27
@faketalent remove `document.querySelector('button').addEventListener('click', ()=>{` That was just for the snippet demo – Steven Spungin Sep 14 '18 at 18:28
@faketalent you don't need the inner loop ` if (items[i].href.indexOf("confirm") > -1)` – Steven Spungin Sep 14 '18 at 18:30
@faketalent I added your code corrected to the end of my answer. – Steven Spungin Sep 14 '18 at 18:32
what browser are you using? – Steven Spungin Sep 14 '18 at 19:54
I'm using Google Chrome. – faketalent Sep 14 '18 at 19:55
I use chrome also and it works. It sounds like you have a popup blocker or something else limiting your windows. When I put the example code in an html file with the `div` container, and run it from my desktop, 3 windows open. – Steven Spungin Sep 14 '18 at 20:05
Maybe the mail limited my code? Or the code is not finding the other links? – faketalent Sep 14 '18 at 20:06
I added a console.log to the example in the snippet. try that. – Steven Spungin Sep 14 '18 at 20:07
R.I.P Google Chrome has it own Popup-Blocker xD Got it now! Thank You <3 – faketalent Sep 14 '18 at 20:09
@faketalent Great! Don't forget to accept answer, and also delete the answer you posted as example. Happy coding! – Steven Spungin Sep 14 '18 at 20:11

score 0 · Answer 2 · answered Sep 14 '18 at 13:04

0

as far as i know please use ES2015 code instead of ES2016.

var links = document.querySelectorAll('*[class^="confirm_link"]');
document.querySelector("button").addEventListener("click", function() {
for (var i = 0; i < links.length; i++) {
 var _href = links[i].getAttribute("href");
 if (_href.indexOf("confirm") > -1) 
    window.open(_href, "_blank");
 }
});

use this may be this will be helpful

answered Sep 14 '18 at 13:04

Negi Rox

3,364
1
8
15

Also just opening one window.. :/ – faketalent Sep 14 '18 at 19:05
@faketalent you want every anchor in new window? – Negi Rox Sep 17 '18 at 05:30

Get href from specific class

2 Answers2