0

Im trying to make a chrome extension that manipulates a website to press a link if the headline is equal to a variable like:

var wantedItem = "exempel 4";

if ($("h1") == wantedItem) {
    $("a")[0].click();
  } else {
    *tries the next one*
 }

But the problem is that the website i try to do this on doesn't name the diffrent h1 and it look like this:

<h1><a class="name-link" href="">exempel 1</a></h1>
<h1><a class="name-link" href="">exempel 2</a></h1>
<h1><a class="name-link" href="">exempel 3</a></h1>
<h1><a class="name-link" href="">exempel 4</a></h1>
<h1><a class="name-link" href="">exempel 5</a></h1>
<h1><a class="name-link" href="">exempel 6</a></h1>
<h1><a class="name-link" href="">exempel 7</a></h1>
<h1><a class="name-link" href="">exempel 8</a></h1>
<h1><a class="name-link" href="">exempel 9</a></h1>

How can i check if my variable is equal to the h1 when there are more with the same name?

Hope anyone can help and understood what i wrote

MariusE
  • 37
  • 7

5 Answers5

0
var wantedItem = "exempel 4";

const link = [...document.querySelectorAll(".name-link")]
 .find( el => el.innerHTML === wantedItem );

if( link ) link.click();

Simply find that element that has that certain content, then click on that ( or do sth else ).

Jonas Wilms
  • 132,000
  • 20
  • 149
  • 151
0

try something like this

var wantedItem = "exempel 4";

if ($("h1").text() == wantedItem) {
    $(this).find("a")[0].click();
  } else {
    *tries the next one*
 }
RAHUL S R
  • 1,569
  • 1
  • 11
  • 20
0

You can use the :contains() selector to achieve this:

var wantedItem = "exempel 4";
$('h1:Contains("' + wantedItem + '") a')[0].click();


// just for this demo:
$('h1 a').click(function(e) {
  console.log($(this).text());
});

var wantedItem = "exempel 4";
$('h1:Contains("' + wantedItem + '") a').click();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1><a class="name-link" href="">exempel 1</a></h1>
<h1><a class="name-link" href="">exempel 2</a></h1>
<h1><a class="name-link" href="">exempel 3</a></h1>
<h1><a class="name-link" href="">exempel 4</a></h1>
<h1><a class="name-link" href="">exempel 5</a></h1>
<h1><a class="name-link" href="">exempel 6</a></h1>
<h1><a class="name-link" href="">exempel 7</a></h1>
<h1><a class="name-link" href="">exempel 8</a></h1>
<h1><a class="name-link" href="">exempel 9</a></h1>
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
0

Use :contains():

var wantedItem = "exempel 4";

var theH1 = $('h1:contains(' + wantedItem + ')');
theH1.find('a').click();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1><a class="name-link" href="">exempel 1</a></h1>
<h1><a class="name-link" href="">exempel 2</a></h1>
<h1><a class="name-link" href="">exempel 3</a></h1>
<h1><a class="name-link" href="">exempel 4</a></h1>
<h1><a class="name-link" href="">exempel 5</a></h1>
<h1><a class="name-link" href="">exempel 6</a></h1>
<h1><a class="name-link" href="">exempel 7</a></h1>
<h1><a class="name-link" href="">exempel 8</a></h1>
<h1><a class="name-link" href="">exempel 9</a></h1>
Stuart
  • 6,630
  • 2
  • 24
  • 40
-1
var wantedItem = "exempel 4";

if ($("h1") == wantedItem) {
    $("a")[0].click();
} else {
*tries the next one*
}

$("h1") will actually return you an object, which you are trying to match with a string value. What you actually need to do is access innerHTML and match it with the respective string. To do so jquery provides you with .text function. Second thing what you will need to do is loop through all the element to find your match, jquery provides you with .each function for the same.

var wantedItem = "exempel 4";

$( "h1 > a" ).each(function( index ) {
     if($( this ).text() == wantedItem){
       //perform click here.
       $( this )[0].click();
     }
 });
Naresh Pingale
  • 246
  • 1
  • 6