情報技術者試験 過去問道場で解説が半透明になるのを防ぐ拡張機能
前回、
応用情報技術者過去問道場|応用情報技術者試験.com
で解説が半透明になり見えにくくなる問題の原因を調査しました。
今回は、解説が透明になるのを防ぐブラウザ拡張機能(アドオン)を開発してみます。
開発は、Firefoxで行います。
拡張機能の開発は以下のページを参考に行います。
1. ディレクトリの作成
任意の場所に任意の名前のディレクトリを作成します。
今回は、デスクトップに「KakomonDontOpacity」という名前のディレクトリを作成しました。
2. manifest.jsonを作成
作成したディレクトリ「KakomonDontOpacity」内に「manifest.json」ファイルを作成し、以下のように記述します。
{ "name": "KakomonDontOpacity", "description" : "過去問道場で解説が透明になるのを防ぎます。", "version": "1.0", "manifest_version": 2, "content_scripts":[ { "matches":["*://www.ap-siken.com/*", "*://www.db-siken.com/*", "*://www.nw-siken.com/*"], "js":["kakomon_dont_opacity.js"] } ] }
"content_scripts"配列内の"matches"では、対象となるURLを選択できます。
今回は、「応用情報技術者試験.com」「データベーススペシャリスト.com」「ネットワークスペシャリスト.com」を指定しました。
3. kakomon_dont_opacity.jsの作成
ディレクトリ「KakomonDontOpacity」内に「kakomon_dont_opacity.js」ファイルを作成し、以下のように記述します。
var insertText = '<ins class="adsbygoogle">abc</ins>'; document.body.insertAdjacentHTML('afterbegin', insertText);
前回の記事で調査した通り、情報技術者試験 過去問道場ではinsタグでadsbygoogleクラスの1つ目の要素の文字数が0のとき解説を半透明にする処理を行っていました。
「適当な文字を入れたinsタグでadsbygoogleクラスの要素」をbodyタグ先頭に追加すれば、上記条件に引っかからなくなります。
【2018/05/16 追記】
過去問道場の半透明化処理の条件式が変更されていました。
上記処理では半透明化を防げません。
以下のソースに変更してください。
詳細はこちら。
var ads = document.getElementsByClassName('adsbygoogle'); for (var i = 0; i < ads.length; i++){ ads[i].innerHTML = 'abc'; }
4. インストール
"about:debugging" を Firefox で開いたら "一時的なアドオンを読み込む" をクリックし、アドオンのディレクトリにあるファイルをどれか 1 つ選択します。
5. テスト
μBlock等のコンテンツブロッカーを有効にします。
次に、応用情報技術者過去問道場|応用情報技術者試験.com
にアクセスし、解説を表示させます。
解説が透明になっていなければ、成功です。
今回は以上です。