ITエンジニア/デザイナ向けにオープンソースを毎日紹介

jQueryはもう使いたくないと思いつつ、使った方が楽になるという場面は多いです。Ajaxもその一つですが、Superagentやaxiosといった代替ライブラリを使うこともできます。そしてもう一つはDOM操作です。

DOM操作を素のJavaScriptだけで書こうと思うと若干面倒です。そこで使ってみたいのがnanoJSです。

nanoJSの使い方

nanoJSはjQuery風のDOM操作だけを提供するライブラリです。書き方はjQueryのままです。

$(".someClass").css("background-color:green;").html("Hello World");
$('#c').animate('2.3', '1.2','0','1','1','0','0', '0','0','1').css('background-color:red').text('Hello');
$("#a").on("click", function(){
  $("#someDiv").css("background-color:green;color:#fff;");
});

要素の取り方が若干違うかも知れません。

this.value[0].getAttribute(v);

nanoJSはDOM操作に特化しているので、わずか0.6KB(難読化時)しかありません。jQueryの書き方に酷似しているので、既存のコードをほぼそのまま移行できるのではないでしょうか。なおブラウザはIE9から使えるので、これから新規で作るものであれば十分でしょう。

nanoJSはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

nanoJS - Minimal standalone JS library for DOM manipulation

vladocar/nanoJS: Minimal standalone JS library for DOM manipulation

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2