1 NOTES

JavaScriptでオブジェクトの値から配列を作成する方法を紹介しています。

オブジェクトの値から配列を作成する

オブジェクトの値から配列を作成するにはObject.values()メゾッドを使う事で簡単に実装する事が可能 ...

JavaScriptで配列の要素、値をランダムに並び替える（シャッフルする）方法を紹介しています。

JavaScriptにはshuffle関数はないので、用途に合わせてコードを書くか、配列やオブジェクトのランダムな並び替え ...

Anywhere stickersの付箋オプション

Google ChromeやMicrosoft EdgeなどのChromium系ブラウザでインターネットの回線速度が計測できるスピードテスト系拡張機能「Speed Test」の使い方を紹介しています。

Speed Testについ ...

画像内の配色もピクセル単位で取得可能な人気のカラーピッカー系拡張機能「Awesome Color Picker」と簡単な使い方を紹介しています。

Awesome Color Pickerについて

「Awesome Color ...

Google ChromeブラウザやEdgeなどのChromium系ブラウザで利用できるCSSのスタイルチェックツール「CSS Peeper」について紹介しています。

CSS Peeperについて

「CSS Peeper」は ...

Google ChromeなどのブラウザでHTML要素のサイズ、位置を計測する事が可能な定規ツールな拡張機能「Page Ruler Redux」の使い方を紹介しています。

Page Ruler Reduxについて

「Page ...

Google ChromeブラウザやEdgeなどのChromium系ブラウザで利用可能なスクリーンショット系拡張機能「GoFullPage – Full Page Screen Capture」の使い方を紹介しています。

Google Chromeブラウザを利用していると複数のタブを開いている際にタブを切り替えると再読み込み（リロード）される事があります。

この記事ではその原因と対策について紹介しています。

タブが再読み込みになる原因 ...

Google ChromeブラウザやEdgeなどのChromium系ブラウザにIEライクなメニューバーを表示する拡張機能「Proper Menubar」の使い方を紹介しています。

Proper Menubarについて

Goo ...

YouTubeを始めとしたVimeo、Dailymotion、Hulu、Metacafe、YouKuなどの動画メディアサイトで動画を再生中にシアターモードを適用して動画部分以外を暗くする事ができるChromeの拡張機能「Turn Of ...

Google ChromeブラウザやEdgeなどのChromium系ブラウザでカウントダウンタイマーまたはカウントアップタイマーが利用可能になる拡張機能「countDown」の使い方を紹介しています。

countDownについて ...

Google ChromeブラウザやEdgeなどのChromium系ブラウザでタブ毎の音量調節も可能なボリュームコントローラーの拡張機能「Volume Master」の使い方を紹介しています。

Volume Masterについて ...

Google ChromeブラウザやEdgeなどのChromium系ブラウザにてブラウザ版YouTubeの再生速度を手軽に変更・調節する事が可能な拡張機能「Youtube Playback Speed Control」の使い方を紹介し ...

拡張機能、Page load timeの使い方

Google Chrome他、edgeなどchromiumベースのブラウザで手軽にオフラインモードに切り替える事ができる拡張機能「Offline Mode」とその使い方を紹介しています。

「Offline Mode」について

Google Chrome他、edgeなどchromiumベースのブラウザで手軽にメモリの解放ができる拡張機能「Monitor and Clean system’s CPU/RAM usage」を紹介しています。

「 ...

Google Chromeブラウザで拡張機能アイコンを利用してツールバーにシンプルで小さな時計を表示する「simpleClock」の使い方を紹介しています。

simpleClockについて

「simpleClock」はGoo ...

Google Chromeブラウザでタブを好みのレイアウトで画面分割して表示する事ができる拡張機能「デュアルレス」の使い方を紹介しています。

デュアルレスについて

「デュアルレス（GoogleChrome™用の ...

Furigana Extensionの使い方

ブラウザで電卓を起動して計算が可能なGoogle Chromeの拡張機能「Calculator」を紹介しています。
※Chromeのウェブストアでの表示場所によっては「電卓」と表記されます。

Calculatorについて ...

ブラウザで簡易的な計算が可能なGoogle Chromeの拡張機能「電卓」を紹介しています。

電卓について

「電卓」は、その名前の通りブラウザ内に電卓機能を追加するGoogle Chromeの拡張機能のひとつです。

Google ChromeブラウザでWEBサイトを表示するフォントサイズ、フォントの種類や色を変更できる拡張機能「Font Changer Plus」を紹介しています。

Font Changer Plusについて

「Font ...

JavaScriptでフォームにある利用規約に「同意する」チェックボックスのボタンとチェックしたら送信フォームを無効化から有効化に切り替える良くあるコンテンツのサンプルコードです。

同意するチェックと送信ボタンの無効化・有効化

CSSの疑似クラス:focus-withinを使って選択中（フォーカス中）のフォームの親要素のスタイルを指定する方法を紹介しています。

focus-withinの使い方

:focus-withinの簡単な使い方を紹介していま ...

JavaScriptでincludes()メゾッドを使って配列内に指定した値があるかどうか確認する方法を紹介しています。

配列に指定の値があるかどうか確認

JavaScriptで配列の値を検索・調べる方法やメゾッドはいくつも ...

JavaScriptで秒またはミリ秒を時間、分に変換する方法を紹介しています。

1日、1時間、1分がそれぞれ何秒かのメモはこちら。

秒分時間1分60秒1分ー1時間3600秒60分1時間1日86,400秒1,440分2 ...

JavaScriptで除算（割り算）した際のの余り値を取得する方法を紹介しています。

また「割り切れるかどうか」の簡単な判別や割れた数と余りを取得するサンプルコードも置いてあります。

除算（割り算）での余りを取得する ...

CSSで重なり合う要素の深度を変更して表示順序を並び替える方法を紹介しています。

深度を変更する方法

CSSの深度はz-indexプロパティにて設定可能となっています。

positionプロパティで位置指定した際 ...

CSSを使わずにdisplay:noneをHTMLのみで指定可能なHTMLのグローバル属性「hidden」と簡単な指定方法を紹介しています。

hiddenで要素を非表示にする

HTML5から追加された属性hiddenは、HT ...

JavaScriptのループ処理のひとつ、for of文で値と一緒に要素のインデックス番号も取得する方法を紹介しています。

for ofで配列のインデックス番号も取得する

配列をentries()メゾッドにて指定する事で値と ...

JavaScriptで配列にある要素の数を取得する方法を紹介しています。

配列の要素数を取得する

lengthプロパティを使って配列内にある要素の長さ、数を取得します。

以下のサンプルコードでは3つの値がある配列 ...

JavaScriptで配列の値をjoin()メゾッド連結して文字列に変換する方法を紹介しています。

配列の値を連結して文字列にする

配列の値が文字列や数値、または文字列や数値で構成された配列の場合、join()メゾッドを使っ ...

JavaScriptで配列にある値の合計値を取得するサンプルコードを紹介しています。

配列にある値の合計値を取得する

配列の値の合計値を計算する方法としてreduce()メゾッドを活用する方法があります。

red ...

JavaScriptで作成された2つ、または2つ以上の配列・多次元データを連結してひとつの配列にする方法を紹介しています。

2つ以上の配列を連結する

配列データを連結して統合するのにJavaScriptではconcat()メ ...

JavaScriptで配列データをサイトのコンテンツデータとしてローカルストレージに保存する方法を紹介しています。

このサンプルコードは配列・オブジェクト型のデータでも同様に扱えます。

配列をローカルストレージに保存 ...

JavaScriptで指定した変数が配列かどうかを確認・判別するサンプルコードを紹介しています。

配列かどうか確認する

Array.isArray()メゾッドを使って指定した変数に格納されているデータが配列かどうかを判別しま ...

JavaScriptで配列が空かどうか確認・判別するサンプルコードを紹介しています。

配列が空かどうか確認する方法

以下のサンプルコードにて指定した配列かどうかを判別します。

配列に一つ以上の値がある場合、len ...

JavaScriptで配列をキー名を連番としたオブジェクト型に変換する方法とサンプルコードを紹介しています。

Object.assign()で配列をオブジェクト型に変換する

Object.assign()メゾッドを使って配列 ...

オブジェクト（連想配列）の値のみをjoin()メソッドを使って連結、文字列に変換する方法を紹介しています。

オブジェクトの値をjoin()で連結して文字列に変換する

オブジェクト型のデータでjoin()メソッドを利用したい場 ...