如何创建一个<a>，其中_blank作为目标属性值，url作为href，样式显示：隐藏在a子元素中？然后添加到DOM，然后在子元素上触发单击事件。

更新

这行不通。浏览器会阻止默认行为。它可以通过编程方式触发，但不遵循默认行为。

自己检查一下：http://jsfiddle.net/4S4ET/

是否在新选项卡或新窗口中打开URL，实际上由用户的浏览器首选项控制。无法在JavaScript中覆盖它。

window.open（）的行为取决于它的使用方式。如果它是作为用户操作的直接结果调用的，让我们假设单击一个按钮，它应该可以正常工作并打开一个新的选项卡（或窗口）：

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => {
    // open a new tab
    const tab = window.open('https://attacomsian.com', '_blank');
});

但是，如果您尝试从AJAX请求回调打开新选项卡，浏览器将阻止它，因为它不是直接的用户操作。

要绕过弹出窗口阻止程序并从回调中打开新选项卡，这里有一个小技巧：

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => {

    // open an empty window
    const tab = window.open('about:blank');

    // make an API call
    fetch('/api/validate')
        .then(res => res.json())
        .then(json => {

            // TODO: do something with JSON response

            // update the actual URL
            tab.location = 'https://attacomsian.com';
            tab.focus();
        })
        .catch(err => {
            // close the empty window
            tab.close();
        });
});

如果您只想打开外部链接（指向其他站点的链接），那么JavaScript/jQuery的这一功能很好：

$(function(){
    var hostname = window.location.hostname.replace('www.', '');
    $('a').each(function(){
        var link_host = $(this).attr('hostname').replace('www.', '');
        if (link_host !== hostname) {
            $(this).attr('target', '_blank');
        }
    });
});

为了阐述史蒂文·斯皮尔伯格的答案，我在这样一个案例中这样做了：

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

这样，就在浏览器跟随链接之前，我正在设置目标属性，因此它将在新的选项卡或窗口中打开链接（取决于用户的设置）。

jQuery中的一行示例：

$('a').attr('target', '_blank').get(0).click();
// The `.get(0)` must be there to return the actual DOM element.
// Doing `.click()` on the jQuery object for it did not work.

这也可以通过使用本机浏览器DOM API来实现：

document.querySelector('a').setAttribute('target', '_blank');
document.querySelector('a').click();

这种方式与以前的解决方案类似，但实施方式不同：

.social_icon->CSS类

 <div class="social_icon" id="SOME_ID" data-url="SOME_URL"></div>

 $('.social_icon').click(function(){

        var url = $(this).attr('data-url');
        var win = window.open(url, '_blank');  ///similar to above solution
        win.focus();
   });

function openTab(url) {
  const link = document.createElement('a');
  link.href = url;
  link.target = '_blank';
  document.body.appendChild(link);
  link.click();
  link.remove();
}