JavaScript

jQueryのoffsetメソッドをJavaScriptだけで実装する方法をまとめました。 top, leftの取得 jQuery const left = $('#hoge').offset().left; const top = $('#hoge').offset().top; JavaScript const rect = document.getElementById('hoge').ge...

ページ読み込み完了時に処理を実行する jQuery $(document).ready(eventHandler); // または $(document).ready(() => { // 処理 ); JavaScript document.addEventListener('DOMContentLoaded', eventHandler); // または document.addEventLis...

概要 脱jQueryのためのメモ。 Fetch APIを使うとXMLHttpRequestよりも簡単に処理を記述することができる。ただし、IEは非対応であるため、polyfillを使ってトランスパイルする必要がある。polyfillにはnpmのwhatwg-fetchパッケージを使う。 jQuery $('#hoge').load(url, completeCallback); JavaScrip...

脱jQueryのためのメモ。 テキスト、HTMLの取得・設定 取得$el.text();⇒el.textContent;$el.html();⇒el.innerHTML;設定$el.text('xxx');⇒el.textContent = 'xxx';$el.html('xxx');⇒el.innerHTML = 'xxx'; 要素削除 $el.remove();⇒el.parentNode.r...

脱jQueryのためのメモ。 要素を取得するためのメソッド ID指定の場合はdocument.getElementById、それ以外はdocument.querySelectorAll（1要素だけ取得する場合はdocument.querySelector）を使うdocument.getElementsByClassNameは使わない（戻り値であるHTMLCollectionはブラウザによってはit...