カテゴリー:Javascript小技

リスト表示へ

タグ名から要素を検索する getElementsByTagName

2006年12月11日 10:36

ということで、タイトル通りですw
このメソッド(でいいのかな?)は、前々から知ってはいたんですが、
使い方を知りませんでした。そして、調べていたら
なんと前からほしい! と思っていたメソッドではないですか!

簡単に説明すると、

element.getElementsByTagName('タグ名');


とすると、elementで指定した要素の中に含まれる
'タグ名' を持つ子要素のリストを返す、というもの。
これで、親要素さえ取得できれば、その下の子要素にもアクセスできるようになる、という。

これを知らないときは、アクセスしたい子要素全部にidを付けてましたよ…。
ソースが無駄に増えるし、scriptも汎用性なくなるしで色々苦労した覚えが…。
でもこれからはそんな悩みもなくscriptが組める!

onmouseoverのイベントで関数に(this)でオブジェクトを渡してやって、
さらにその子要素にアクセスできれば、idなんかはできるだけ少なくて済みそうです。

知ってる人は知ってるだろし、わりと当たり前のことかもしれないけど、
わりと目からウロコだったので備忘録的に書いてみました(*'-')

Javascriptによる外部CSSファイルの切り替え

2006年6月22日 20:45

Javascriptによる外部CSSファイルの切り替え、なんとかできるようになりました。
ポイントは「document.getElementsByTagName("link")[i]」これ。
これでlink属性の情報を取得できるんだねー。

ただ、値を変更、というのはできない模様。
linkのalternate stylesheet属性を使って複数のCSSを読み込ませ、
それのdisabledを変更していくことでCSSが切り替わる仕組み。

簡単に言えば、alternate stylesheetでの切り替え作業をJavascriptが代替えする形かな。
(IE6にはCSS切り替え機能は未実装。内部的には把握してるらしいけど、むしろなんでやねんて感じw)

まぁJavascriptでアクセスできるなら、これが使えるからいちおう切り替えできるから文句言うまい。

大概は文字サイズとかを変更するのに使われるけど、これでmenuの位置を好きな場所に移動できる、みたいな感じで使えばわりと面白いかもしんない。

Cookieと組み合わせて自分流にカスタマイズさせる、みたいな。

※ついでもあったので、新しくエントリーを書き直しました。
書き直したエントリーは以下を参照ください。

前の10件 1  2  3