リンク付きタイトルをクリップボードにコピーするブックマークレット（Word,Gmail等に貼り付け可）

概要

タイトルとURLを取得するブックマークレットを2種類ご紹介します。
※IEでは機能しません。

①タイトルとURLをコピーするブックマークレット。

下図のようにタイトルー[改行]ーURLの文字列を貼り付けることがでます。

See the Pen Bookmarklet -Title&Url- by ryo fujii (@VideoNiks) on CodePen.

②ハイパーリンク付きタイトルを生成してコピーするブックマークレット。

WordやGmail等で下図のようにリンク付きで貼り付けることがでます。
※ノートやメモ帳では機能しない可能性があります。

See the Pen Bookmarklet -Hyperlink Title- by ryo fujii (@VideoNiks) on CodePen.

⬇解説図（ブックマークツールバーにドラッグ&ドロップ）

補足

ブックマークレットのコード

①ハイパーリンク付きタイトル

javascript:(function()%7Bnull%20!%3D%3Dnavigator.clipboard%20%3F%20navigator.clipboard.write(%5Bnew%20ClipboardItem(%7B'text%2Fhtml'%3A%20new%20Blob(%5B'%20%3Ca%20href%3D%22%20'%20%2B%20document.URL%20%2B%20'%20%22%3E%20'%20%2B(document.title%20!%3D%3D''%3F%20document.title%3Adocument.URL)%2B%20'%20%3C%2Fa%3E%20'%5D%2C%7Btype%3A%20'text%2Fhtml'%7D)%7D)%5D)%3A%20alert(%22navigator.clipboard%20not%20supported%22)%3B%7D)();

②タイトルとURL

javascript:(function()%7Bnull%20!%3D%3Dnavigator.clipboard%20%3F%20navigator.clipboard.writeText(document.title%20%2B%20'%5Cr'%20%2B%20document.URL%2B%20'%5Cr')%3A%20alert(%22navigator.clipboard%20not%20supported%22)%3B%7D)();

ハイパーリンク付きタイトルを生成するコードについて

aタグの文字列をコピーしてもリンク付き文字列にはなりません。MIMEタイプをHTMLにする必要があります。そのためバイナリデータにしてからクリップボードに書きこんでいます。

(function () {
    null !== navigator.clipboard ?
        navigator.clipboard.write(
            [new ClipboardItem({'text/html':
                        new Blob([' <a href = " ' + document.URL + ' "> ' + (document.title !== '' ? document.title : document.URL) + ' </a> '],
                            {type: 'text/html'})
                        })]
            )
        : alert("navigator.clipboard not supported");
})()

ラウザーの互換性

navigator.clipboardを使用しているので互換性は以下です。
Navigator.clipboard - Web API | MDN　#ブラウザーの互換性

動機

GoogleドキュメントではURLを書くとリンク先のタイトルに置きかえるよう提案してくれますがMicrosoft Wordではそのような機能が無いので作ました。