読み込んだページに独自の要素を表示させる [Safari Extensions を作ってみる：第八回]

Safari Extensions を作っていくにあたり、読み込んだページに独自の要素を表示させたい場合は、「機能拡張ビルダー」の「スクリプトを終了」の項目に Javascript を指定し、その中で操作することができる。

とりあえず、「<p>test</p>」を表示してみるときはこんな感じで。

★test.js

var test = document.createElement("p");
test.textContent = "test";
document.body.insertBefore(test, document.body.firstChild);

あとはこれに css で position: absolute; などで整形していけば、既存のページの見た目を害せずに表示することができる。