JavaScript | JSONを配列にエンコード、配列をJSONにデコードをする方法
JavaScriptで配列をJSONコードにエンコード、JSONコードを配列にデコードする方法の紹介です。 JSON.stringify()で配列をJSONにエンコードする JavaScriptで配列をJSONに変換するにはJSON.str ...
JavaScript | filter()で配列から空値を削除する方法
JavaScriptのfilter()関数のオプションにBooleanを指定して配列から空値を削除する方法の紹介です。 filter(Boolean)の基本 filter()関数の引数にBooleanを指定することで、配列の値から空の値、0 ...
JavaScript | 配列の先頭や末尾に値を追加する方法
JavaScriptのpush()、unshift()で配列の先頭と末尾にデータを追加する方法の紹介です。 push()関数で配列の末尾に値を追加する push()関数は引数に追加する値を指定することで、配列の末尾に新しくデータを追加します ...
JavaScript | trim()で文字列の先頭、末尾から空白文字を除去する方法
JavaScriptのtrim()関数を使って文字列の先頭、末尾から空白文字を除去する方法のサンプルコードです。 trim()は文字列の先頭と末尾から「半角スペース」「全角スペース」「タブ」「すべての改行文字」を取り除いた結果を返します。 ...
JavaScript | ダブルクリックイベント、Shift+ダブルクリック等のイベントを実装する方法
JavaScriptのみでダブルクリックイベント、Shiftを押しながらのダブルクリックのイベントを実装するサンプルコードの紹介です。 JavaScriptでダブルクリックイベント JavaScriptでダブルクリックイベントを実装した動作 ...
JavaScript | フォーム内でのEnterキーの入力を取得する方法
PCメインのコンテンツでテキストフォームの値を取得して処理をしたい場合に、ユーザービリティの観点からEnter（リターン）キーを使った発火イベントは有効な場合が良くあります。 Enter（リターン）キーにイベント処理を加えるには、いくつかの ...
JavaScript | マウスホイールイベントを実装する方法
JavaScriptでマウスホイールの操作情報を取得してイベントを実装する方法です。 マウスホイールの操作情報を取得する JavaScriptでマウスホイールの操作・アクションを取得するには「window.onmousewheel」を利用し ...
JavaScript | スクリプト内で別のjsファイルを読み込む方法
JavaScript内でXMLHttpRequest()を使って別のjsファイルを読み込んで別ファイルのJavaScript関数を実行する方法になります。 JavaScript内で別のJavaScriptファイルを読み込むサンプルコード 別 ...
JavaScriptでスクロールに合わせて背景色のCSSを変更する方法
スクロール量に合わせてページの背景色のCSSを変更していく方法と、シンプルなJavaScriptの動作サンプルとサンプルコードです。 スクロール量に合わせて背景色を変更する 動作サンプル See the Pen JavaScript Cha ...
JavaScriptでCSSのスタイルを動的に変更する方法
JavaScriptを使ってCSSのスタイルを動的に変更する方法です。 要素の背景色を変更するボタン、要素のポジションを変更するボタン、また.styleで指定可能な主なstyle属性一覧を紹介しています。 要素の背景色を変更するボタン Ja ...
JavaScript | マウスホバーイベントを実装する方法
JavaScriptを使って指定した要素に対してマウスホバー（マウスオーバー）イベントを実装する方法です。 マウスホバーイベントを実装する方法 JavaScriptを使って指定した要素に対してマウスホバー（マウスオーバー）イベントはaddE ...
JavaScriptで要素のclassからidを取得する方法
JavaScriptを使ってクリック時などに要素のclassからidを取得する方法です。 クリック時・マウスホバー時・ドラッグ時などのパターンを紹介しています。 要素のクリック時にclassからidを取得する方法 JavaScriptを使っ ...
JavaScriptで表示中のページがHTTPかHTTPSかを判別する方法
JavaScriptを使って現在表示中のページがHTTPかHTTPSかを判別する方法です。 またHTTPの場合にHTTPSのページにリダイレクトする方法も紹介しています。 httpかhttpsかを判別する方法 location.protoc ...
JavaScriptで文字列の前方一致や後方一致を判別する方法
JavaScriptを使った文字列の前方一致や後方一致を判別する方法です。 文字列の前方一致を判別する startsWith()関数を利用して文字列の前方一致を判別する方法になります。 startsWith()関数は指定した文字列の前方が第 ...
JavaScriptで左クリックや右クリックイベントの実装方法
テキストや要素上での左クリックまたは右クリックをトリガーにしたJavaScriptイベントの実装方法です。 左クリックをトリガーにしたイベントの実装方法 JavaScriptで左クリックをトリガーにしたイベントの実装方法になります。 実装サ ...
JavaScript | 数値をマイナスをプラスに、プラスをマイナスに変更する方法
JavaScriptを使ってマイナス値をプラス値に、プラス値をマイナス値に変更する方法です。 マイナスをプラス、プラスをマイナスにする マイナスをプラス、プラスをマイナスにする相互変換であれば、以下のような記述にて実装することが可能です。 ...
JavaScript | 正規表現判別サンプル集
JavaScriptで使う正規表現の判別サンプル集になります。 javaScriptでの正規表現フラグ | JavaScriptメモ 正規表現での判別サンプル集 指定の文字が含まれているか if( str.match(/o/) ){ //含 ...
javaScriptの正規表現フラグ
「i」大文字小文字を区別しない 「i」をフラグに指定すると検索対象を大文字と小文字の区別をさせずに処理が可能になります if(`Hello World`.match(/hello/i)){ console.log('true'); } 「m ...