0

Been trying to automatically open specific links in a div on a new tab when the page is loaded. I can't edit the links to add ids or classes (cause I'm using tampermonkey), it would have been much easier this way:

<div class="Joblist">
   <a href="http://example.com/car_wash">Car Wash</a>
   <a href="http://example.com/Cleaning">Cleaning</a>
   <a href="http://example.com/Tow_Car">Tow Car</a>
   <a href="http://example.com/Babysit">Babysit</a>
 </div>

In this case, Car wash or car-related job link will be automatically open in new tab when the page is loaded. Any help with this in JavaScript? It would be very kind of you and much appreciated.

ulou
  • 5,542
  • 5
  • 37
  • 47
  • Add attribute `target="_blank"` to your `a` tag. – ulou Jun 08 '21 at 09:38
  • Been trying to automatically open it. not manually and neither I cant edit it. – Mahbub Hasan Jun 08 '21 at 09:41
  • 1
    Why can't you edit the code? Can you use js? – deepakchethan Jun 08 '21 at 09:42
  • Because it's a website and I am not allowed to edit. Even If I do add (target="_blank") would it open automatically? Of course No. – Mahbub Hasan Jun 08 '21 at 09:47
  • Does this answer your question? [How to open link in a new tab in HTML?](https://stackoverflow.com/questions/17711146/how-to-open-link-in-a-new-tab-in-html) – Liam Jun 08 '21 at 10:42
  • Because I have to open a lot of links and I don't wanna do it manually and it takes a lot of time. that's why. – Mahbub Hasan Jun 08 '21 at 11:23
  • I see couple same questions, without correct answer. OP is using `tampermonkey` (tag is added from very beginning), it's browser extension to automate things on page or add some kind of own written scripts (game bots ect.), that's why he cannot edit any code to source. – ulou Jun 08 '21 at 12:12
  • As it is external site, if you can somehow write JS then on page load try triggering a method and in that method use `window.open('url here')`. This might work only if you can use custom JS in the code somehow I have no idea about `tampermonkey`. If you cant even add custom JS like you said you cant edit then you may ask their support if you can somehow. – Wahab Shah Jun 08 '21 at 14:20

2 Answers2

0
  1. Select all nodes (using e.g. querySelectorAll),
  2. (optional) Filter links by keyword (using e.g. filter),
  3. Iterate over them (using e.g. forEach),
  4. Open links 1 by 1 (using e.g. window.open).

Working solution below, however new tabs cannot be opened from SO code snippet.

const links = document.querySelectorAll('a')
Array.from(links) // We need to cast NodeList to Array in order to use filter
     .filter(l => l.innerHTML.includes('Car'))
     .forEach(l => window.open(l.href, '_blank'))
<div class="Joblist">
   <a href="http://example.com/car_wash">Car Wash</a>
   <a href="http://example.com/Cleaning">Cleaning</a>
   <a href="http://example.com/Tow_Car">Tow Car</a>
   <a href="http://example.com/Babysit">Babysit</a>
</div>
ulou
  • 5,542
  • 5
  • 37
  • 47
0

If you want to achieve this through JavaScript, you can try query selecting all the anchor tags inside the div with the class name of "Joblist" like so

const jobLinks = document.querySelectorAll("div.Joblist > a")
jobLinks.forEach(a => a.setAttribute("target", "_blank"));
Etsh
  • 116
  • 2
  • 11