JS的最佳实践 - 在href或onclick中的window.open(）

Best Practice for JS - window.open() in href or in onclick?

本文关键字：中的 onclick window open href 最佳 JS      更新时间：2023-09-26

只是一个关于优化的问题，介于：

<a href="#" onClick="javascript:window.open('myUrl.com');">link-1</a>

和：

<a href="javascript:window.open('myUrlBis.com');">link-2</a>

一个比另一个好吗？还是更兼容？谢谢。

最佳做法是使用 target 属性：

<a href="http://myUrl.com" target="_blank">link-1</a>

如果这不适合，我可以选择click处理程序（理想情况下不通过属性分配）。

两者都不是

使用href和target使其成为常规链接 

<a id='my-link' target="_blank" href="http://myUrlBis.com">link-2</a>

如果您需要使用 JavaScript 对点击进行一些处理，您可以使用以下内容

document.getElementById("my-link").onclick = function(e) {
  // Do some processing here, maybe 
  window.location = this.href
  // Return false to prevent the default action if you did redirect with script
  return false;
}

No JavaScript

<a target="_blank" href="myUrlBis.com">link</a>

使用 JavaScript

<a target="_blank" href="http://www.example.com" id="myLink">link</a>
<script>
    document.getElementById("myLink").onclick = function(){ //attach click event to link
        var winPop = window.open(this.href);  //`this` is reference to link, get href
        return false;  //prevent click event from clicking the link
    }
</script>

JSFiddle 示例

下面的代码应该没问题。

<a href="javascript:void(0);"  onclick="window.open(url)">

在IE（版本：11）中发现以下代码的问题

<a onclick="javascript:window.open(url)">

问题：当我们在 href 属性中有 javascript window.open 代码时，父窗口在 IE 中刷新。

相关文章：