on:2018年5月31日sponsors要素にclassを加えたり、変更したり、要素を削除したり、::beforeや::afterを加えたり、要素の表示位置を取得したり、変更したり、クリックやホバーのイベントを設定したり、基本的なDOM操作を実行するためだけに開発された超軽量ライブラリを紹介します。jQueryは使うけど、$関数や上記の挙動しか利用しないという人には、特にぴったりなスクリプトです。-GitHubnanoJSの特徴nanoJSのデモnanoJSの使い方nanoJSの特徴トータル100行、0.6kBの超軽量スクリプト。jQueryに似た構文が利用でき、オブジェクトの連鎖的もサポート。それぞれのメソッドは単独で機能するため、削除・追加することも可能。toggleClassのみ非対応)。nanoJSのデモドキュメントでは、nanoJSで利用できる構文がすべてまとめられています。外部ファイル当スクリプトを外部ファイルとして記述します。src="https://unpkg.com/@vladocar/nanojs@1.0.1/src/nanoJS.min.js"></script>よく使用する構文DOMを操作する構文をいくつか紹介します。$関数をはじめ、jQueryとほぼ同じ使い方なので、簡単だと思います。指定した要素に、classを与えます。JavaScript$("#a").addClass("newclass");1$("#a").addClass("newclass");指定した要素に、アニメーションを与えます。'0','0','1');指定した要素の属性に値を設定します。JavaScript$('#c').attr("class","newclass");1$('#c').attr("class","newclass");指定した属性に値を設定します。JavaScript$(".someClass").css("background-color:green");1$(".someClass").css("background-color:green");指定した要素の子要素を全て削除し、空にします。JavaScript$('#c').empty();1$('#c').empty();指定した要素のHTMLを書き換えます。World!</p>");指定した要素の後に、HTMLを加えます。World!</p>");指定した要素の位置を取得・設定します。"px");指定した要素の任意のイベントをバインドします。