我可以在Markdown中使用“ target =“ _ blank””创建链接吗?

有没有一种方法可以在Markdown中创建一个在新窗口中打开的链接? 如果没有,建议您使用哪种语法。 我将其添加到我使用的markdown编译器中。 我认为这应该是一个选择。


#1楼

尝试使用PHP实现降价时,我遇到了这个问题。

由于用户生成的使用markdown创建的链接需要在新选项卡中打开,而站点链接需要保留在选项卡中,因此我将markdown更改为仅生成在新选项卡中打开的链接。 因此,并非页面上的所有链接都链接出去,只有使用markdown的链接会链接出去。

在markdown中,我将所有链接输出更改为<a target='_blank' href="..."> ,使用查找/替换就很容易了。


#2楼

我不同意留在一个浏览器选项卡中会带来更好的用户体验。 如果您希望人们留在您的网站上,或者回来阅读完该文章,请在新标签中将其发送出去。

以@davidmorrow的答案为基础,将此JavaScript放入您的网站,然后仅将外部链接变成具有target = _blank的链接:

    <script type="text/javascript" charset="utf-8">
      // Creating custom :external selector
      $.expr[':'].external = function(obj){
          return !obj.href.match(/^mailto\:/)
                  && (obj.hostname != location.hostname);
      };

      $(function(){
        // Add 'external' CSS class to all external links
        $('a:external').addClass('external');

        // turn target into target=_blank for elements w external class
        $(".external").attr('target','_blank');

      })

    </script>

#3楼

使用GNU sed和make仅针对外部链接自动进行

如果要对所有外部链接系统地执行此操作,则CSS是不可选项 。 但是,一旦从Markdown创建(X)HTML,就可以运行以下sed命令:

sed -i 's|href="http|target="_blank" href="http|g' index.html

通过将上述sed命令添加到makefile可以进一步实现自动化。 有关详细信息,请参见GNU make或在我的网站查看我是如何做到的


#4楼

您可以通过本地javascript代码执行此操作,如下所示:


var pattern = /a href=/g;
var sanitizedMarkDownText = rawMarkDownText.replace(pattern,"a target='_blank' href=");

JSFiddle代码


#5楼

您可以使用{[attr] =“ [prop]”}添加任何属性

例如[Google]( http://www.google.com ){target =“ _ blank”}


#6楼

使用Markdown-2.5.2,您可以使用以下命令:

[link](url){:target="_blank"}

#7楼

对于完整的Alex回答(2010年12月13日)

可以使用以下代码来实现更智能的注入目标:

/*
 * For all links in the current page...
 */
$(document.links).filter(function() {
    /*
     * ...keep them without `target` already setted...
     */
    return !this.target;
}).filter(function() {
    /*
     * ...and keep them are not on current domain...
     */
    return this.hostname !== window.location.hostname ||
        /*
         * ...or are not a web file (.pdf, .jpg, .png, .js, .mp4, etc.).
         */
        /\.(?!html?|php3?|aspx?)([a-z]{0,3}|[a-zt]{0,4})$/.test(this.pathname);
/*
 * For all link kept, add the `target="_blank"` attribute. 
 */
}).attr('target', '_blank');

您可以通过在(?!html?|php3?|aspx?)组结构中添加更多扩展名来更改regexp异常(在此处了解此regexp: https : //regex101.com/r/sE6gT9/3 )。

对于没有jQuery版本的代码,请检查以下代码:

var links = document.links;
for (var i = 0; i < links.length; i++) {
    if (!links[i].target) {
        if (
            links[i].hostname !== window.location.hostname || 
            /\.(?!html?)([a-z]{0,3}|[a-zt]{0,4})$/.test(links[i].pathname)
        ) {
            links[i].target = '_blank';
        } 
    }
}

#8楼

在我的项目中,我正在这样做,并且效果很好:

[Link](https://example.org/ "title" target="_blank")

链接

但并非所有解析器都允许您这样做。


#9楼

没有简单的方法可以做到,就像@alex指出的那样,您需要使用JavaScript。 他的答案是最好的解决方案,但是为了对其进行优化,您可能只想过滤内容后链接。

<script>
    var links = document.querySelectorAll( '.post-content a' );  
    for (var i = 0, length = links.length; i < length; i++) {  
        if (links[i].hostname != window.location.hostname) {
            links[i].target = '_blank';
        }
    }
</script>

该代码与IE8 +兼容,您可以将其添加到页面底部。 请注意,您需要将“ .post-content a”更改为用于帖子的类。

如此处所示: http : //blog.hubii.com/target-_blank-for-links-on-ghost/


#10楼

对于幽灵降价使用:

[Google](https://google.com" target="_blank)

在这里找到它: https : //cmatskas.com/open-external-links-in-a-new-window-ghost/


#11楼

我正在使用Grav CMS,它可以完美运行:

正文/内容:
Some text[1]

正文/参考:
[1]: http://somelink.com/?target=_blank

只要确保首先传递了target属性,如果链接中还有其他属性,请将其复制/粘贴到参考URL的末尾。

也可以作为直接链接:
[Go to this page](http://somelink.com/?target=_blank)


#12楼

我认为没有降价功能。

但是,如果您想使用JavaScript自动打开指向自己网站之外的链接,则可能会有其他选项。

var links = document.links;

for (var i = 0, linksLength = links.length; i < linksLength; i++) {
   if (links[i].hostname != window.location.hostname) {
       links[i].target = '_blank';
   } 
}

jsFiddle

如果您使用的是jQuery,则有点简单...

$(document.links).filter(function() {
    return this.hostname != window.location.hostname;
}).attr('target', '_blank');

jsFiddle


#13楼

就Markdown语法而言,如果要详细说明,则只需使用HTML。

<a href="http://example.com/" target="_blank">Hello, world!</a>

我见过的大多数Markdown引擎都允许使用普通的旧HTML,仅在这种情况下,即通用文本标记系统无法将其截断。 (例如,StackOverflow引擎。)然后,无论如何,它们都将通过HTML白名单过滤器运行整个输出,因为即使是仅Markdown的文档也可以轻松地包含XSS攻击。 这样,如果您或您的用户想要创建_blank链接,那么他们可能仍然可以。

如果这是您将要经常使用的功能,则创建自己的语法可能很有意义,但是通常它并不是至关重要的功能。 如果要在新窗口中启动该链接,请自己按住ctrl键单击它,谢谢。


#14楼

Kramdown支持它。 它与标准Markdown语法兼容,但也有许多扩展。 您可以这样使用它:

[link](url){:target="_blank"}

#15楼

一种全局解决方案是将<base target="_blank">放入页面的<head>元素中。 这实际上为每个锚元素添加了默认目标。 我使用markdown在基于Wordpress的网站上创建内容,而主题定制器将让我将该代码注入到每个页面的顶部。 如果您的主题没有做到这一点,那么有一个插件


#16楼

因此,不能将链接属性添加到Markdown URL并不是很正确。 要添加属性,请检查所使用的基础markdown解析器及其扩展名。

尤其是, pandoc具有扩展名以启用link_attributes ,从而允许在链接中进行标记。 例如

[Hello, world!](http://example.com/){target="_blank"}
  • 对于那些来自R的用户 (例如,使用rmarkdownbookdownblogdown等),这是您想要的语法。
  • 对于不使用R的用户 ,您可能需要使用+link_attributes在对pandoc的调用中启用扩展

注意:这与kramdown解析器的支持不同,后者是上面接受的答案之一。 特别要注意的是,kramdown与pandoc有所不同,因为它需要用冒号- : -在大括号的开头- {} ,例如

[link](http://example.com){:hreflang="de"}

尤其是:

# Pandoc
{ attribute1="value1" attribute2="value2"}

# Kramdown
{: attribute1="value1" attribute2="value2"}
 ^
 ^ Colon

#17楼

这对我有用:[页面链接](您的URL在这里“(目标| _blank)”)