简体   繁体   English

重新编写页面上的所有链接以通过javascript在新标签页中打开

[英]re-write all links on page to open in new tab through javascript

To make all links in a page non-clickable, I use the following code: 为了使页面中的所有链接不可单击,我使用以下代码:

<html>
<body>
<script>
document.body.onclick=function(e){
e.preventDefault();
return false;
}
</script>
<a href="http://www.google.com">Link 1</a>
<a href="http://www.ebay.com">Link 2</a>
</body>
</html>

Now I know that to make a link open in a new tab we can use: 现在,我知道要在新选项卡中打开链接,可以使用:

target="_blank"

But that is not the question here, the question is, how can I: 但这不是这里的问题,问题是,我该如何:

1) Make all links clickable through javascript after first making them non-clickable as shown above. 1)如上所示,首先使所有链接不可单击,然后使所有链接都可通过javascript单击。

2) Use javascript to re-write all the URLs in the page to open in a new tab, AKA how can I use javascript to add the necessary target="_blank" attribute to all links in any HTML page? 2)使用javascript重写页面中的所有URL,以在新选项卡中打开。我又如何使用javascript将必要的target="_blank"属性添加到任何HTML页面中的所有链接?

thanks! 谢谢!

 <html> <body> <script> document.body.onclick=function(e){ // or addEventListener e.preventDefault(); return false; } window.onload=function() { document.body.onclick=null; var links = document.querySelectorAll("a"); for (var i=0;i<links.length;i++) { links[i].target="_blank"; } } </script> <a href="http://www.google.com">Link 1</a> <a href="http://www.ebay.com">Link 2</a> </body> </html 

or in jQuery use attr : 或在jQuery中使用attr

$("body").on("click",function(e){
  e.preventDefault();
  return false; // not necessary
});
$(function() {
  $("body").off("click");
  $("a").attr("target")="_blank";
})

如果可以启用对链接的单击,则可以通过将此标签添加到页面<head>来更改默认目标:

<base target="_blank" />

It is easy like this: 像这样很容易:

var aList = document.getElementsByTagName('a');
for(var i = 0 ; i < aList.length; i++){
    aList[i].setAttribute('target', '_blank');
}

But you need to put it at the end of the document. 但是您需要将其放在文档末尾。

But if you don't like it to be at the end of the document and also want it to work across all browsers you can do something like this: 但是,如果您不希望它出现在文档的末尾,并且希望它能在所有浏览器中正常工作,则可以执行以下操作:

var DOMReady = function(a,b,c){b=document,c='addEventListener';b[c]?b[c]('DOMContentLoaded',a):window.attachEvent('onload',a)}

DOMReady(function () {
  var aList = document.getElementsByTagName('a');
  for(var i = 0 ; i < aList.length; i++){
    aList[i].setAttribute('target', '_blank');
  }
});

The DOMReady function is for when the document structure was shaped in the dom. DOMReady函数用于在dom中调整文档结构时。 This part was used from another code in this page: Tiny Cross Browser DOM Ready 本页面的另一个代码使用了此部分: Tiny Cross Browser DOM Ready

Just add: 只需添加:

$(function(){
    $('a').attr('target', '_blank');
});

instead of 代替

document.body.onclick=function(e){
    e.preventDefault();
    return false;
}

BUT, keep in mind that you need to include jQuery to be able to do so. 但是,请记住,您需要包括jQuery才能做到这一点。

将每个锚点的target属性设置为'_blank'

document.querySelectorAll("a").forEach(a => a.target = '_blank' );

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM