[Permalink Page] JavaScriptDOM操作簡略化クラス - simDOM2.0

サーバ移転しました.

http://clipfog.dyndns.org/




標準のDOM操作はわずらわしい.かと言って、DOM操作を簡単にしてくれて、prototype.jsを上書きしないJavaScriptのクラスライブラリがない(それと日本語の解説).というわけで自分で作りました.

JavaScriptの型判定には通常typeof演算子を使うのですが、Objectまでは分かるけれどその実体がArrayなのか分からなかったりするのでkanegonさんのテクニックを参考にさせていただきました.

■特徴

  • 他のライブラリと共存可能(侵害しない)
  • 他のライブラリに依存しない
  • 多くのDOM操作を一括で行える
  • prototype.jsと使えば最強

■言い訳とお願い

  • 例外処理は全く施していません.
  • プログラミングを仕事にしているわけじゃないので、プログラミングの流儀や作法などがあまりよろしくないかもしれませぬ.
  • 修正BSDライセンスで公開します.よって改良、再配布自由です.むしろ勝手にガシガシ改良・再配布することをお願いしたいです.

ダウンロード

ソース: simDOM.js [3.5KB]

圧縮版: simDOM_comp.js [2.3KB]

v2.0: 大幅に機能拡張.ファイルサイズ4KB→3.5KBまで縮小.圧縮版も配布.

v1.01: appCntメソッドで文字列が末尾に追加されない問題を修正.

インスタンス生成

普通にインスタンスの生成です.

creElm(element_name[, attr_list])

このメソッドはエレメントオブジェクトを作成します.また、オプションでエレメントに属性を付加できます.

また、配列を使えば一括で複数のエレメントを生成し、配列で返します.属性を[{~}, {~},...]とすることで各エレメントに個別に属性を設定できます.

setAttr(element, attr_list)

このメソッドは指定したエレメントに属性を設定します.エレメントは配列で複数指定可能です.(すべてのエレメントに同じものが入ります)

appCnt(element, content)

このメソッドは指定したエレメントの末尾に、オブジェクトや文字列、またはそれらが混在した配列の中身を追加します.エレメントは配列で複数指定可能です.(すべてのエレメントに同じものが入ります)

delSelf(element)

このメソッドは指定したエレメント自体を削除します.配列を渡せば一度に複数のエレメントを削除することが可能です.

delChi(element[, node])

■elementに配列を使わないとき
このメソッドは指定したエレメントの子ノードを削除します.削除するノードを指定するときはnodeにノードを渡してください.ノードの配列を渡せばエレメントの複数のノードを削除できます.省略すると子ノードがすべて削除されます.

■elementに配列を使ったとき
このメソッドは指定した各エレメントの子ノードを全削除します.

delAttr(element[, name])

■elementに配列を使わないとき
このメソッドは指定したエレメントの属性を削除します.属性名をnameに渡せばその属性が削除されます.属性名の配列をnameに渡せば複数の属性を削除できます.省略したときは全削除です.

■elementに配列を使ったとき
このメソッドは指定した各エレメントの各属性を削除します.nameに配列を使った場合は複数の属性を削除できます.属性を省略した場合は全削除します.

trackback (0)

TRACKBACK URL: http://www.clipfog.org/mt/mt-tb.cgi/19