-->
YTech

RSSをコピーできるブックマークレットを作ってみた!

みなさんこんにちは2001Y(@Y20010920T)です。

少し前にJavaScriptをかじり、それ以降また触らなくなっていたのですが、今回はRSSをコピーできるブックマークレットを作ってみました。Feedly登録するためのブックマークレットだったりと、純粋にクリップボードにコピーする。 というものはありませんでした笑

RSSをコピーできるブックマークレットを作ってみた!

RSS Copy BookMarklet
ドラッグ&ドロップして追加してください!スマホの場合は長押しでコピーできます。

ここでドラッグせずに開いてもらえばわかると思いますが、見た目の変化は何もないのですが、きちんとクリップボードにコピーされています。下のエリアで試してみてください。

これだけなら、ウィンドウでRSSリンクを表示してもいいのですが、この後に様々な処理を加えればより便利になると思います。

少しでも楽に IFTTT にRSS登録できるように!

ScreenShot
PocketをRSSで活用する - やはり、Poketは万能だった。 | YTech
hatena

PocketをRSSリーダー化するためにはIFTTTに登録しなければなりません。

毎回、検索して順番に設定していくのもめんどくさいので、ギリギリまで(RSSをコピーして登録画面まで移動する)自動化させてみました! ほんとは、全部自動でやってみたいのですがそんな技術力はどこにあるのやら...

RSS to IFTTT BookMarklet
同じくドラッグ&ドロップして追加してください!スマホの場合は長押しでコピーできます。

ドラッグせずに開いてもらえばわかりますが、フィードリンクを入れるところまで飛ばせます。当ブログも是非登録お願いします!笑

解説

IFTTT登録版 はコピーだけと1行多いだけなので IFTTT登録版 で説明していきます。初心者なりの感覚で作ってるので、何かあれば教えてください。よろしくお願いします。

var links = document.getElementsByTagName('link');

変数 links にHTMLのに入った項目を指定します。この時点では、スタイルシートやらいろいろ含まれているわけです。

for (var i = 0; links[i]; ++i) {
  if (links[i].getAttribute('type') == 'application/rss+xml' && links[i].hasAttribute('href')) var FeedLink = links[i].getAttribute('href');
}

内の type に application/rss+xmlapplication/atom+xml と href があるものに絞り込みます。そして、その href の値、すなわちRSSリンクを 変数 FeedLink に指定します。
正直色々見比べながら作ったので詳しいことはわかりません...

ここまでで、RSSリンクの取得は完了です。変数 FeedLink に入っています。
続いては、クリップボードへのコピーです。ここがなかなかの難所。

var CopyArea = document.createElement("textarea");
CopyArea.textContent = FeedLink;

変数 CopyArea にテキストエリアを作成することを指定し、中に 変数 FeedLink すなわち、RSSリンクを入れます。

var body = document.getElementsByTagName("body")[0];
body.appendChild(CopyArea);

変数 body にbodyを指定し、bodyの子要素に 変数 CopyArea すなわち、RSSリンクを入れた新しいテキストエリアを配置します。

これで、bodyの子要素のテキストエリアにRSSリンクが入力されている状態になります。

CopyArea.select();
document.execCommand('copy');

RSSリンクを入れたテキストエリアである、変数 CopyArea を選択し、 document.execCommand('copy'); を使いコピーします。

body.removeChild(CopyArea);
window.open('//ifttt.com/create/if-feed?sid=7', '_blank');

最後に、後処理を行います。
コピーするために作った 変数 CopyArea をいらないので消去し、最後にIFTTTのRSS登録画面まで行けるリンクに飛ばします。

参考

ScreenShot
ReederのローカルRSSに便利な『RSSのURLを表示するブックマークレット』 » crocodile notebook [ 鰐ノート ]
hatena

最後に

MyIcon 2001Y JavaScript初心者にはこれでも精一杯ですね笑 それにしても、 document.execCommand('copy'); がない時は大変だったと思いますね...
以上、JavaScriptでRSSをコピーできるブックマークレットを作ってみた!でした。

関連記事

コピー完了