LeaVerou / md-block

A custom element for rendering stylable (light DOM) Markdown
https://md-block.verou.me
MIT License
322 stars 17 forks source link

Any way for links to open on a new tab? #20

Open ygarasab opened 8 months ago

ygarasab commented 8 months ago

Tried adding {:target=”_blank”} but didn't work

K-mikaZ commented 7 months ago

Personally I use this trick (I commented which is useless here):

// Place in header (do not use async or defer)
document.addEventListener('readystatechange', event => {
  switch (document.readyState) {
    /*
    case "loading":
    console.log("document.readyState: ", document.readyState,
      `- The document is still loading.`
    );
    break;
    */
    /*
    case "interactive":
      console.log("document.readyState: ", document.readyState,
        `- The document has finished loading DOM. `,
        `- "DOMContentLoaded" event`
      );
    break;
    */
    case "complete":
      /*console.log("document.readyState: ", document.readyState,
        `- The page DOM with Sub-resources are now fully loaded. `,
        `- "load" event`
      );*/
      links = document.links;
      Array.from(links)
        .filter(link => link.href.startsWith('http') && link.hostname != window.location.hostname)
        .forEach(a => Object.assign(a, { target: "_blank", rel: "noreferrer" }));
      /* All current versions of major browsers now automatically use the behavior of rel="noopener" https://html.spec.whatwg.org/multipage/links.html#link-type-noreferrer */
      break;
  }
});