Two buttons with same class but different Titles, click with javascript

Question

According to previous question Previous question

I have this button And i want you to help me to click it with javascript code. Here is the class of the button.

Before click

 <a class="UFILikeLink" href="#" role="button" aria-label="Like this" aria-live="polite" data-ft="{"tn":">"}" data-reactid=".19l">

<i class="UFILikeLinkIcon img sp_nbjSKc2Bl8j sx_49c162" data-reactid=".19l.0"></i>

<span data-reactid=".19l.1">Like</span></a>

After click

<a class="UFILikeLink UFILinkBright" href="#" role="button" aria-label="Unlike this" aria-live="polite" data-ft="{"tn":">"}" data-reactid=".19l">

<i class="UFILikeLinkIcon img sp_nbjSKc2Bl8j sx_df3f80" data-reactid=".19l.0">

</i><span data-reactid=".19l.1">Like</span></a>

@dikkini made up a solution with this code

var el = document.getElementsByClassName('UFILikeLink'); 
for (var i=0; i<el.length; i++) {
   var ele = el[i];
   if (!hasClass(ele, "UFILinkBright")) {
     ele.click();
   }
}


function hasClass(element, cls) {
    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
}

BUT now i have one extra button with the same CLASS but different Title. And when i execute 2 times the javascript code, the 2nd button is also pushed. But i dont want it to be pushed at all. No matter how many times i execute the code that dikkini suggested.

The code of this button is this..

<a class="UFILikeLink" data-ft="{"tn":">"}" href="#" role="button" title="Like this comment" data-reactid=".1h.1:4:1:$comment535881486576364_535889293242250/=10.0.$right.0.$left.0.3.$likeToggle/=10">Like</a>

As you can see it has a Title. Can someone help me make an if statement so if it has this title NOT to push it? Thanks a lot!

My second solution using 'aria-label' attribute (with JSFiddle link) in previous question solving your problem, doesn't it? — dikkini
– dikkini, Commented Sep 7, 2015 at 11:05

dikkini · Accepted Answer · 2015-09-07 11:08:07Z

3

To check title you can use this:

var el = document.getElementsByClassName('UFILikeLink'); 
for (var i=0; i<el.length; i++) {
   var ele = el[i];
   if (!hasClass(ele, "UFILinkBright") && ele.getAttribute('title').indexOf('Like this comment') == -1) {

     ele.click();
   }
}


function hasClass(element, cls) {
    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
}

Or your still can check aria-label solution from previous question:

This is for aria-label attribute code:

var el = document.getElementsByClassName('UFILikeLink'); 
for (var i=0; i<el.length; i++) {
   var ele = el[i];
   if (ele.getAttribute('aria-label').indexOf('Unlike this') == -1) {
     ele.click();
   }
}

JSFiddel for aria-label attribtue code.

answered Sep 7, 2015 at 11:08

dikkini

1,1921 gold badge23 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

user4544229 Over a year ago

Now its same for both, i get Uncaught TypeError: Cannot read property 'indexOf' of null at <anonymous>:5:68 at Object.InjectedScript._evaluateOn (<anonymous>:875:140) at Object.InjectedScript._evaluateAndWrap (<anonymous>:808:34) at Object.InjectedScript.evaluate (<anonymous>:664:21)

user4544229 Over a year ago

After the alert"GO" i get another one Alert which say "null"

dikkini Over a year ago

I just now opened my fiddle and get 5 alerts whithout null anywhere. Check again.

user4544229 Over a year ago

youtube.com/watch?v=7_Ry7mNWKT4 check out this video i show you what is going on

user4544229 Over a year ago

but when i ran the javascript code from the previous answer is clicking the buttons as i wanted.

|

Konstantinos Natsios · Accepted Answer · 2015-11-09 19:04:44Z

0

Array.from(document.querySelectorAll('._4l5  .UFILikeLink')).forEach(btn => {
        btn.click();

});

This is the code that you are looking for. It hits the button with the class UFILikeLink which is INSIDE the div which has the class _4l5. And you dont have to worry for other buttons with the same class. Hope it helped.

answered Nov 9, 2015 at 19:04

Konstantinos Natsios

2,9249 gold badges42 silver badges78 bronze badges

Collectives™ on Stack Overflow

Two buttons with same class but different Titles, click with javascript

2 Answers 2

8 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related