Warning: Undefined array key "steps" in /home/bubudoufu/bubudoufu.com/public_html/wp-content/plugins/amp/src/ReaderThemeSupportFeatures.php on line 501
ブックマークを日付順に一覧表示するブラウザの拡張機能を作ってみる。その2 - プログラミングを学習中の私が、アウトプットするためのサイト
サイトアイコン プログラミングを学習中の私が、アウトプットするためのサイト

ブックマークを日付順に一覧表示するブラウザの拡張機能を作ってみる。その2

このページではソースコードの一部分を簡単な解説をしています。

Chromeブラウザをお使いの方はコチラから拡張機能をインストール出来ます
Edgeブラウザをお使いの方はコチラから拡張機能をインストール出来ます
ソースコードはgithubにあります

スポンサーリンク

前回作成した拡張機能に機能を追加

前回作成した拡張機能にフォルダ別でブックマークを表示する機能とブックマークから消す機能を追加しました。

ブックマークフォルダを取得する

chrome.bookmarksAPIのgetTreeメソッドを使用して一度すべてのブックマークを取得した後、フォルダ名を抜き出しています。フォルダ名をクリックすると21行目の関数が実行され、GETパラメーターでフォルダ名とフォルダのIDが送信され新しいタブが開かれます。

フォルダ内のブックマークを一覧表示する

chrome.bookmarksAPIのgetChildrenメソッドを使用してフォルダ内にあるブックマークを取得します。第一引数にはファルダのID、第二引数には取得したブックマークが返り値で返ってくるので、コールバック関数で処理します。

ブックマーク消す機能を追加

14行目のonclickに登録されている関数でブックマークを消しています。ブックマークを消すには chrome.bookmarksAPIのremoveメソッドを使用します。引数にはブックマークのidを渡す必要があります。javascriptのparentNode.removeメソッドで表示画面からも消しています。

最後までお読みいただきありがとうございました。

Chromeブラウザをお使いの方はコチラから拡張機能をインストール出来ます
Edgeブラウザをお使いの方はコチラから拡張機能をインストール出来ます
ソースコードはgithubにあります

モバイルバージョンを終了