jQueryはもう使いたくないと思いつつ、それでも使ってしまうのはDOM操作が面倒だからです。ReactやVueを使えばDOMの不便さから逃れられますが、ちょっとしたものを作る際には大げさだったりします。
そこで使ってみたいのがfemtoJSです。DOM操作に特化した小さなライブラリです。
femtoJSの使い方
ボタンのオンオフを取得するデモです。
ちゃんと取得できます。
femtoJSはjQuery同様に$を使ってクラスやIDを指定します。使えるメソッドは以下の通りです。
addClass
attr
css
empty
getAttr
html
insertAfter, insertBefore, insertFirst insertLast
offset
on
parent
removeAttr
removeClass
text
toggleClass
いずれもjQueryでよく使っているものでしょう。jQueryの場合、これにAjaxがよく使われますがあ、ES6であればFetch APIを使うようになっています。femtoJSはES6に特化していますのでレガシーなWebブラウザでは動作しません。そういった点が割り切れればサイズも小さく便利なライブラリでしょう。
femtoJSはJavaScript製のオープンソース・ソフトウェア(MIT License)です。
vladocar/femtoJS: femtoJS - Really small JavaScript (ES6) library for DOM manipulation.
MOONGIFTの関連記事