またやります。API紹介とか、小さい感じでやっていきたい。

禁句: 「今さらDOMかよ」

2015-12-00

  1. innerHTMLの代わりにinsertAdjacentHTML()を使ってみようか。
  2. querySelector()を使うとjQueryみたいにセレクターで要素を取得できるよ。
  3. el.matches()で要素が目的のものか確認できるよ。
  4. el.closest()で直近の要素を探せるかもね。
  5. クラス操作はclassListで楽々です。
  6. removeChilde()で要素を削除できるけど、面倒だよね。
  7. 属性の操作はsetAttribute()とかremoveAttribute()とか、あとattributesで。
  8. 要素以外にもノードはあるので、nodeType見て確認してね。
  9. textContentでjQueryみたいに文字列で取れるけど、ちょっと注意が必要ね。
  10. 各種ノードの作り方と表示のさせ方をまとめておきました。
  11. 細かい文字列ノードが邪魔なら正規化 (normalize) してみては。
  12. ノードと要素は別物なので気を付けよう。
  13. NodeListとHTMLCollectionも別物なので気を付けよう。
  14. ツリーを歩き回るならTreeWalkerはどうかな。
  15. isEqualNode()で構成が同じか確認できるよ。
  16. compareDocumentPosition()で要素の位置を比較できるよ。
  17. data属性を扱うならdatasetで楽ちん。
  18. jQueryのon()をDOMでやるとaddEventListener()。ちょいと面倒だな。
  19. イベントに関係する要素は教えてもらえるよ。
  20. イベント監視中にできる事ふたつ。
  21. イベント監視で教えてもらえる情報いろいろ。（共通系編）
  22. jQueryのtrigger()みたいに、イベントを作ったり発火させたりしてみよう。
  23. DOMでjQuery風ライブラリーを自作するための基本戦略です。
  24. DOMを使って、jQueryなしでいろいろやってみよう。コピペでどうぞ。

去年まで