文系のIT勉強メモ

勉強中のメモと、インフラの覚書き

Chrome 新規ページでbookmarklet

掲題のことをやりたくて、こちらの記事を見つけた。 新規タブの空白ページでも動作するブックマークレットを作る - Corredor

が、こちらの記事でも、その中にリンクされているページ(※)でも、いまいち、わからなくて、ちょっと試行錯誤したので、書いておく。

javascript bookmarklet does not work in new tab in chrome - Stack Overflow

javascript - Bookmarklet on blank page - Stack Overflow

書かれている内容

ブックマークレットは、そのページで動作させたいJavaScriptjavascript: (function () { ~ })();で囲む。

上記に書かれている解決法は、このようなもの。

代わりに、ホームページを次のようなものに設定してみてくださいdata:text/html,Welcome!(はい、それは有効なURLです)。

つまりどういうこと。。。?これだけだと、自分がつくったscriptはどこにどう入れればいいのかわかりません。。。

これでできた

結論から言うと、これでも動作したし、

data:text/html,Welcome!
    <script>
        javascript: (function () {
            動作させたいスクリプト
        })();
    </script>

これでも動作しました。

 data:text/html,Welcome!
    <script>
            動作させたいスクリプト
    </script>

どういうことかというと

1行目にダミーでいいから何かページを開くのをいれて、

data:text/html,Welcome!

ブックマークレットのときに囲むのにつかったjavascript: (function () { ~ })();の周りをさらに

<script>

</script>

で囲む。

scriptで囲む分、javascript: (function () { ~ })();はもうなくてもいいみたい。(でも、あっても動作した)

おまけ・私がつくったbookmarklet

私が人生で初めて自分で考えてつくったbookmarkletを共有いたします。
CONNPASSで、以下のイベントをとってくるものです。

・今日から1週間分

・東京またはオンライン

JavaScript(キーワードってOR条件にする方法ないんですかね・・・)

data:text/html, Welcome!
    <script>
        javascript: (function () {
            var today = new Date().getFullYear() + '/' + (new Date().getMonth() + 1) + '/' + new Date()
                .getDate();
            var after1week = new Date().getFullYear() + '/' + (new Date().getMonth() + 1) + '/' + (new Date()
                .getDate() + 6);

            document.location.href = 'https://connpass.com/search/?q=JavaScript&start_from=' +
                today +
                '&start_to=' + after1week +
                '&prefectures=tokyo&prefectures=online&selectItem=tokyo&selectItem=online';
        })();
    </script>

上述の方法使ってるので、新規の空白ページからでも動作します。プログラミング初心者なので、効率悪い汚い書き方かもしれませんが、「JavaScript」のところを気になるトピックに書き換えたりして、利用してみてくださいね!