Add “_blank”

/ all-scribbly, javascript / By 

/* here are two different ways to do this */
//using jquery:

$(document).ready(function(){
$('#link_other a').attr('target', '_blank');
});

// not using jquery

window.onload = function(){  var anchors = document.getElementById('link_other').getElementsByTagName('a');  for (var i=0; i<anchors.length; i++){    anchors[i].setAttribute('target', '_blank');  }}

// jquery is prettier. :-)

You could also add a title tag to notify the user that you are doing this, to warn them, because as has been pointed out, it’s not what users expect:

$('#link_other a').attr('target', '_blank').attr('title','This link will open in a new window.');

adding “_blank” to data-href

could be done like this:

jQuery: JSFiddle 1

$('.table-row').each(function() {
  var $th = $(this);
  $th.on('click', function() {
    window.open($th.attr('data-href'), $th.attr('data-target'));
  });
});

Pure JS: JSFiddle 2

var tableRows = document.getElementsByClassName('table-row');

for (var i = 0, ln = tableRows.length; i < ln; i++) {
  tableRows[i].addEventListener('click', function() {
    window.open(this.getAttribute('data-href'), this.getAttribute('data-target'));
  });
}

JQuery

$(document).ready(function(){

  $('a[href=http://www.google.com]').click(function(){
    window.open(this.href);
    return false;
  });
});

Change href targets with jquery

Using

$("a").attr("href", "http://www.google.com/")

will modify the href of all hyperlinks to point to Google. You probably want a somewhat more refined selector though. For instance, if you have a mix of link source (hyperlink) and link target (a.k.a. “anchor”) anchor tags:

<a name="MyLinks"></a>
<a href="http://www.codeproject.com/">The CodeProject</a>

…Then you probably don’t want to accidentally add href attributes to them. For safety then, we can specify that our selector will only match <a> tags with an existing href attribute:

$("a[href]") //...

Of course, you’ll probably have something more interesting in mind. If you want to match an anchor with a specific existing href, you might use something like this:

$("a[href='http://www.google.com/']").attr('href', 'http://www.live.com/')

This will find links where the href exactly matches the string http://www.google.com/. A more involved task might be matching, then updating only part of the href:

$("a[href^='http://stackoverflow.com']")
   .each(function()
   {
      this.href = this.href.replace(/^http:\/\/beta\.stackoverflow\.com/,
         "http://stackoverflow.com");
   });

The first part selects only links where the href starts with http://stackoverflow.com. Then, a function is defined that uses a simple regular expression to replace this part of the URL with a new one. Note the flexibility this gives you – any sort of modification to the link could be done here.

[jQuery] Open links in a new window or tab

Adding a target=”_blank” attribute to your links will open them in a new window or tab. It’s possible to use jQuery to open a link or links in a new window without directly editing html source codes.

You can add target=”_blank” to your link(s) using the attr method:

$(document).ready(function(){
$("a[href^='http']").attr('target','_blank');
});

Now, every link will be opened in a new window. You might also specify the relevant class:

$(document).ready(function() {
$("class name").attr({"target" : "_blank"})
})

As you know, if you add a class, it should be .class_name. And if you add an id, it should be #id_name.

It’s possible to use window.open:

$(document).ready(function(){
$('.class_name').click(function(){
window.open(this.href);
return false;
});
});

If you want to limit to specific URLs:

$(document).ready(function(){
$('a[href=http://www.google.com]').click(function(){
window.open(this.href);
return false;
});
});
// Source: http://befused.com/

Then, all links with http://www.google.com will be opened in a new window.

If you want to open all links within comments in WordPress in a new window, you can replace the class section with #comments a.

$(window).ready(function(){
//adds target blank to all comment links in WordPress
$('#comments a').each(function(){
$(this).attr('target','_blank');
});
});
// Source: wordpress.org

Of course, you might use a WordPress hook to do this instead of jQuery (Please refer to this post.) There are also WordPress plugins which open external links in a new window, such as Open external links in a new window.

Getting element using aria-description

querySelector or querySelectorAll with an attribute selector should do it:

// The first element that matches (or null if none do):
var element = document.querySelector('[aria-describedby="slick-slide00"]');
// A list of matching elements (empty if none do):
var list = document.querySelectorAll('[aria-label="Message Body"]');

Or if that ID is stable, simply:

var element = document.getElementById(":ik");

(Note that the d is lower case; you have it in upper case in your example.)

Either way, make sure your code doesn’t run until the page is loaded, by including this in your manifest:

"run_at": "document_end"

(A little) more in this answer, which references this Google documentation.

Related Posts