通过 class 获取元素并使其在新选项卡中打开

Question

我在 HTML 中获得了一些由 WordPress 简码构建的链接。不幸的是，这个短代码不包含目标属性，这样我就无法在新选项卡中打开链接。

我不是程序员，我正在寻找一些 JS 来在特定 class 下创建一些链接在新选项卡中打开。

类似于：

if ("a" tag is under "div.newTab" class) onClick {window.open in a new tab}

希望大家理解！

谢谢大家

Answer 1

您可以通过循环遍历指定class下的所有链接来设置target属性。

Demo

(function(){

 $(".newTab a").each(function(i, obj){
  
   obj.setAttribute("target", "_blank");
 
  });
 
})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="newTab">
  <a href="https://bhansa.github.io">bhansa</a>
  <a href="http://google.com">Google</a>
</div>

Answer 2

window.onload = function()
{
    var allLinks = document.querySelectorAll("div.newTab a");
    for(var i=0;i<allLinks.length;i++)
    {
        var currentLink = allLinks[i];
        currentLink.setAttribute("target","_blank");
    }
}

Answer 3

如果您想避免操作页面上的大量链接，您可以使用 jQuery 捕获对 .newTab div 中链接的点击并对其采取行动。

示例HTML

<div class="someClass">
    <a href="http://google.com">Google</a>
</div>

<div class="newTab">
    <a href="http://wikipedia.org">Wikipedia</a>
</div>

javascript

$( document ).ready( function( $ ) {
    $( '.newTab a' ).click( function( event ){
        event.preventDefault();
        window.open(( this ).href, '_blank');
    });
});

工作jsFiddle

Answer 4

$(document).on('click', 'div.newTab a', function(e){ 
    e.preventDefault(); 
    var url = $(this).attr('href'); 
    window.open(url, '_blank');
});

通过 class 获取元素并使其在新选项卡中打开

Get an element by class and make it open in a new tab

javascript

css

class

new-window