ぐりもん関係の思いつきメモ

スタイル周りの話

今回の 「nicovideo Thumbinfo popup」 のように，不特定多数のサイトで何かを表示するようなスクリプトは，そのサイトに元々指定されていたスタイルの影響を受けてしまう。
スタイルを全解除するようなCSSを書いてもいいが，それは面倒だし予期せぬセレクタに対応できなさそう。
そこで，xhtml限定になってしまうかもしれないが，独自に要素を定義してしまうのはどうだろう。こんな感じで。

<my:div xmlns:my="http://www.d.hatena.ne.jp/gifnksm/">
<my:h1>タイトル</my:h1>
</my:div>

こうすれば元々指定されているスタイルの影響は受けないはず。
ただし，要素自体の取り扱いが面倒になる。(document.createElementの代わりにcreateElementNSを使わなくてはいけない，など)
今回のスクリプトのように，一度要素を生成したら，それ以降変更しない，というような場合には使えるかもしれない。
xhtmlでないhtmlのページに独自のxml要素を挿入したらどうなるかは要調査。

追記

これじゃリンクが作れないな。xlinkとか使えばできるのか？？要勉強。

さらに追記

とりあえずxlinkを使って普通のリンクが張れることは確認。

<my:div xmlns:my="http://www.d.hatena.ne.jp/gifnksm/"
        xmlns:xlink="http://www.w3.org/1999/xlink/">
<my:h1 xlink:type="simple" xlink:href="http://www.example.com/">タイトル</my:h1>
</my:div>

ただし，画像が挿入できない。やり方を調べてその通りにやってもだめ。Firefoxが埋め込みに対応していないようだ。／(^o^)＼ナンテコッタイ

ページ構築後に変更された要素

ページ構築後に追加されたリンクにマウスカーソルを載せたとき何かする，というスクリプトは簡単に書けることが分かった。こんな感じで。

document.addEventListener('mouseover', function(e) {
    if(typeof e.target.href == 'undefined')
        return;
    //do something.
}, false);

マウスの動きを常にキャプチャすることになるから動作は多少重くなるかも。それでもこんなに簡単に書けるのは魅力的。IEのbehaviourがあれば - なんとなく目記で書いたような機能が無くても実現できる。