有没有办法在Markdown中创建一个在新窗口中打开的链接?如果不是,您建议使用什么语法来完成此操作?我将把它添加到我使用的markdown编译器中。我认为这应该是一个选择。


当前回答

使用MUI v5“markdown-to-jsx”

这似乎对我很管用:

import Markdown from 'markdown-to-jsx';

...

  const MarkdownLink = ({ children, ...props }) => (
    <Link {...props}>{children}</Link>
  );

...

          <Markdown
            options={{
              forceBlock: true,
              overrides: {
                a: {
                  component: MarkdownLink,
                  props: {
                    target: '_blank',
                  },
                },
              },
            }}
          >
            {description}
          </Markdown>

其他回答

完成alex回答(12月13日至10日)

一个更聪明的注入目标可以用下面的代码完成:

/*
 * 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';
        } 
    }
}

不是一个直接的答案,但可能会帮助一些人在这里结束。

如果你正在使用GatsbyJS,有一个插件可以自动在markdown中添加target="_blank"到外部链接。

它被称为gatsby-remark-external-links,用法如下:

Yarn添加gatsby-remark-external-links

plugins: [      
  {
    resolve: `gatsby-transformer-remark`,
    options: {
      plugins: [{
        resolve: "gatsby-remark-external-links",
        options: {
          target: "_blank",
          rel: "noopener noreferrer"
        }
      }]
    }
  },

它还负责rel="noopener noreferrer"。

如果需要更多选项,请参考文档。

幽灵降价使用:

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

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

我不认为有降价功能,尽管如果你想用JavaScript自动打开指向你自己网站以外的链接,可能有其他可用的选项。

Array.from(javascript.links)
    .filter(link => link.hostname != window.location.hostname)
    .forEach(link => link.target = '_blank');

jsFiddle。

如果你正在使用jQuery:

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

jsFiddle。

如果您只想在特定的链接中执行此操作,只需使用其他人回答的内联属性列表语法,或者只使用HTML。

如果你想在所有生成的<a>标签中这样做,这取决于你的Markdown编译器,也许你需要一个扩展。

这些天我正在为我的博客做这个,它是由pelican生成的,它使用Python-Markdown。我找到了Python-Markdown Phuker/markdown_link_attr_modifier的扩展,它工作得很好。注意,旧的名为newtab的扩展在Python-Markdown 3.x中似乎不起作用。