JavaScript

スポンサーリンク
JavaScript

【脱jQuery】JavaScriptだけで要素のtop, leftを取得・設定する方法

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

「Node.js超入門」の感想・備忘録3

Node.js 超入門 第2版posted with ヨメレバ掌田津耶乃 秀和システム 2018年08月25日頃 楽天ブックスで見る楽天koboで見るAmazonで見るKindleで見る 「Node.js超入門」の感想・忘備録2の続き HTTPクライアント var https = require('https'); https.get({ host: 'www.google.com', port:...
JavaScript(書評)

「Node.js超入門」の感想・備忘録2

Node.js 超入門 第2版posted with ヨメレバ掌田津耶乃 秀和システム 2018年08月25日頃 楽天ブックスで見る楽天koboで見るAmazonで見るKindleで見る 「Node.js超入門」の感想・忘備録1の続き JavaScriptの復習 ローカルストレージ 保存<script>localStorage.setItem('name', 'hoge');</script> 取...
スポンサーリンク
JavaScript(書評)

「Node.js超入門」の感想・備忘録1

Node.js 超入門 第2版posted with ヨメレバ掌田津耶乃 秀和システム 2018年08月25日頃 楽天ブックスで見る楽天koboで見るAmazonで見るKindleで見る 書籍「Node.js超入門」のまとめ。 点数 87点 感想 とてもわかりやすかった。 今後Node.jsを実務でどう使っていくか、は考えていかなければならないと思う。 Node.jsとは Javascriptのラ...
JavaScript

【脱jQuery】JavaScriptだけでイベント処理を行う

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

【脱jQuery】JavaScriptだけでAJAX通信を行う

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

【脱jQuery】JavaScriptだけでDOMを操作する

脱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...
JavaScript

【脱jQuery】JavaScriptだけでセレクタ指定により要素を取得する

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

「速習ECMAScript6」の感想・備忘録

posted with ヨメレバAmazonで見るKindleで見る kindle本「速習ECMAScript6」のまとめ。 点数 78点 感想 ES2015だけに絞れこまれた内容だったが、しっかりと学ぶことができた。2015年発売の本なので仕方がないが、現在(2020年3月)はbabelのバージョンが上がっているため、インストール方法や設定方法が変わってしまっていた。その辺りを調べるのにかなり時...
JavaScript

【JavaScript】console.log(e)でcurrentTargetがNULLになる?

概要 JavaScriptのイベントハンドラにて、console.log(e);とするとイベントオブジェクトの中身が表示されるが、それはconsole.log(e)を実行した時の中身ではなく、コンソールで確認した時点(▶︎をクリックしてオブジェクトを展開したとき)の中身が表示される。currentTargetは処理が終わるとNULLに書き換わってしまうので、console.log(e);を実行した...
スポンサーリンク