JavaScript逆引きリファレンス JavaScript Reference
ここでは、JavaScriptのクラスやオブジェクト、メソッド、プロパティをご紹介するとともに、それらを応用した関数やライブラリを掲載しています。
- ※ ここでご紹介するものは、あらかじめ存在しているメソッドやプロパティに対して、prototypeの拡張を行わないことを前提としてご紹介しています（つもりです・・・）。
- ※ 更新は不定期で行っています。
- ※ 本リファレンスで公開されているコードは基本的に自由に使用していただいて問題ありません。
- ※ ただし、ライブラリとして公開しているコードについてはライセンスが明記されていますので、ライセンスに従ってご使用ください。
（ライセンスが明記されていない場合はお問い合わせください。） - ※ コード自体を公開・提供等を行う場合は、提供元として当サイトのサイト名（またはページ名）と、該当ページ（またはトップページ）へのリンクを明記してください。
JavaScriptの基本
- JavaScriptとは
- JavaScriptの書き方
- 変数とは
- 配列とは
- 関数とは
- コメントの挿入
- 演算子
- DOMとは
- argumentsオブジェクト
- スコープ
- prototypeオブジェクトとは
- Ajaxとは
- ECMAScriptとは
- メソッドチェーンとは
- アクティベーションオブジェクト
- ガーベージコレクションとは
- JSONとは
- strictモード（厳格モード）
- 正規表現
- 変数の巻き上げ
文
- 処理を繰り返す（for文）
- 処理を繰り返す（while文）
- 処理を繰り返す（do...while文）
- 繰り返しから離脱（中断）する
- 現在の処理を中断し、次の繰り返し処理へ移る
- 条件分岐（if、else、else if文）
- 条件分岐（switch文）
例外
文字列・数値・数式
数値・数式
- 数値か判定
- 数字か判定
- 数字でないか判定
- 有限か判定
- 数値を文字列に変換
- ゼロ埋め（桁を揃える）
- 三角関数の正弦（サイン）を計算
- 三角関数の余弦（コサイン）を計算
- 三角関数の正接（タンジェント）を計算
- 三角関数の逆正弦（アークサイン）を計算
- 三角関数の逆余弦（アークコサイン）を計算
- 三角関数の逆正接（アークタンジェント）を計算
- 自然対数を求める
- べき乗を求める
- 平方根を求める
- 円周率を取得
- 円周の長さを求める
- 扇形の弧の長さを求める
- 中心角を求める
- 円周角を求める
- 正三角形の高さを求める
- 正三角形の面積を求める
- 二等辺三角形の高さを求める
- 二等辺三角形の面積を求める
- 直角三角形の斜辺を求める
- 角度（度数）からラジアンを求める
- ラジアンから角度（度数）を求める
- ラジアンと距離（X・Y軸の半径）から位置を求める
- 2点の座標（線分）から距離を求める
- 2点の座標（線分）からラジアンを求める
- 2点の線分（座標）から交点を求める
- 2点の線分（座標）が交差しているか判定
- 小数点以下を四捨五入
- 小数点以下を切り上げ
- 小数点以下を切り捨て
- 小数点以下を取り除く
- 小数点以下の桁を指定
- 数値の桁数を指定
- 小数点以下の桁数を取得
- 乱数（ランダムな数値）を取得
- 数値の最小値を取得
- 数値の最大値を取得
- 配列内の数値の最小値を取得
- 配列内の数値の最大値を取得
- リサイズ（アスペクト比維持）計算
- 数値のフォーマット設定
- 数値をバイト書式に変換
- 平均値を取得
- 配列内の数値から合計値を算出
- 基数変換
文字列
- 文字列の書き方
- 文字列を数値に変換
- 文字列の検索（前方向検索）
- 文字列の検索（後方向検索）
- 正規表現による文字列の検索（match）
- 正規表現による文字列の検索（search）
- 文字列の置換
- 文字列の長さ（文字数）を取得
- 文字列の出現回数を取得
- ヒアドキュメントを疑似的に使う
- 文字列の分割（区切り文字指定）
- 文字数を指定して文字列を分割
- 同じ文字列の繰り返し
- 指定位置から文字列の取得
- 文字列から指定位置の一文字を取得
- 文字列を切り出す
- 文字列の先端と末端の余白を削除
- 文字列を小文字に変換
- 文字列を大文字に変換
- 文字列の先頭のみ大文字に変換
- 文字列のエスケープ・エンコード処理
- 文字列のアンエスケープ・デコード処理
- 文字列をbase64へエンコード
- base64でエンコードされた文字列をデコード
- 文字列をキャメルケースへ変換
- 文字列をケバブケースへ変換
- 文字列をUnicode（¥uxxx形式）へエスケープ
- Unicode（¥uxxx形式）を文字列へアンエスケープ
- 文字コードの取得とエンティティ変換
- Unicodeの文字コードから文字列を取得
- HTML文字列をエスケープ
- HTML文字列をアンエスケープ
- 文字列内にある全角を半角へ変換
- 文字列内にある半角を全角へ変換
- ひらがなまたはカタカナからローマ字へ変換
- 文字を省略する
- ランダムな文字列を生成
- ユニークIDを生成
- 数字やアルファベットを順番に繰り返す
正規表現
色
- 10進数RGBからHSLへ変換
- 16進数RGBからHSLへ変換
- HSLから10進数RGBへ変換
- HSLから16進数RGBへ変換
- 10進数RGBからHSVへ変換
- 16進数RGBからHSVへ変換
- HSVから10進数RGBへ変換
- HSVから16進数RGBへ変換
選択、クリップボード
配列、連想配列（ハッシュ）、オブジェクト、JSON
- 配列を生成・設定
- 連想配列（ハッシュ）を生成・設定
- 配列の数を取得
- 連想配列（ハッシュ）の数を取得
- 配列の値を1つ取得
- 配列を繰り返して値を取得
- ハッシュ（連装配列）を繰り返して値またはキーを取得
- 配列の値を別の配列へ展開
- 配列かどうか判定
- 配列内に値が最初に見つかったインデックス番号の取得
- 配列のキーの存在を確認
- 配列のキーと値のセットを配列にして新しいイテレーターを生成
- ハッシュ（連装配列）のキーと値のセットを配列にして新しいイテレーターを生成
- 配列を区切り文字を指定して連結し文字列に変換
- ハッシュ（連想配列）を区切り文字を指定して連結し文字列に変換
- 配列を繰り返し処理を行い結果を配列で返す
- 配列同士を連結し新たな配列を生成
- 配列や連想配列（ハッシュ）を結合
- 配列からランダムに値を取得
- 配列の値をシャッフル
- 配列や連想配列（ハッシュ）、オブジェクトのダンプ
- 配列を並び替え（ソート）
- 配列を逆順に並び替え
- 二次元配列または連想配列の並び替え（ソート）
- 配列を切り出す
- 配列の値を削除または置き換える
- 配列に値を最後に追加
- 配列に値を最初に追加
- 配列の最初の値を抜き出し
- 配列の最後の値を抜き出し
- 配列の最後の値を取得
- 配列で評価に合格した値を新しい配列として生成
- 配列で値がすべて評価に合格するかテスト
- 配列でいずれかの値が評価に合格するかテスト
- 配列で評価に合格した最初の値を取得
- 配列内に値があるかを判定
- 配列を繰り返し処理を行い1つの値にする
- 配列同士の比較し中身が一致するか判定
- ハッシュ（連想配列）の要素（キーと値のセット）を削除
- 配列やハッシュ（連想配列）から重複する値を削除
- 配列または連想配列（ハッシュ）のキーを全て取得
- 配列または連想配列（ハッシュ）の値を全て取得
- ハッシュ（連想配列）からあるキーを持つ値を取得
- ハッシュ（連想配列）からあるキーの値と一致した値を取得
- ハッシュ（連想配列）で指定したキーの次の値を取得
- ハッシュ（連想配列）で指定したキーの1つ前の値を取得
- キー（key）の値を持つ配列と値（value）を持つ配列として1つの連想配列（ハッシュ）を生成
- 多次元連想配列の特定のキーに一致する値で最大値となる値を取得
- 多次元連想配列の特定のキーに一致する値で最小値となる値を取得
- 配列を指定数に分割
- 配列の値の数を数える
- table要素をもとにハッシュを生成
JSON
オブジェクト
関数
DOM、エレメント、ノード
要素の生成、削除、置換
- 新しく要素を生成
- 名前空間を指定して新しく要素を生成
- 新しく文字列要素（テキストノード）を生成
- 要素を複製
- 自身の要素の前に要素を追加
- 自身の要素の次に要素を追加
- 要素に子要素を最初に追加
- 要素に子要素を最後に追加
- 自身の要素を削除
- 子孫要素を残して自身の要素のみを削除
- 自身と子孫要素を残して親要素を削除
- 子要素（子ノード）を削除
- 要素の子要素を別の子要素と置き換える
要素の取得
- 特定のID名（ID属性値）から要素を取得
- 特定の要素名（タグ名）から要素を取得
- 特定のclass名（class属性値）から要素を取得
- 特定のname属性値から要素を取得
- 親要素（親ノード）の取得
- 子要素（子ノード）の取得（テキストノードを含む）
- 子要素（子ノード）の取得
- 最も近い先祖要素の取得
- 特定の属性が含まれるNodeの取得
- 次の兄弟要素を取得
- テキストノードを除く次の兄弟要素を取得
- 前の兄弟要素を取得
- 最初の子要素を取得
- 最後の子要素を取得
- 指定したセレクターの1つの要素を取得
- 指定したセレクターの全ての要素を取得
- パターン（セレクター）に一致した要素をすべて取得
- フォーム要素を取得
- href属性が存在するa要素を取得
- CSSのpositionプロパティがstatic以外の最も近い先祖要素を取得
- ノード群から1つのノードを取得
- ドキュメント全体のスクロール要素の取得
- フォーカスしている要素を取得
属性
- クラス名（class属性に値）を追加
- クラス名（class属性に値）を削除
- クラス名（class属性の値）をすべて取得
- クラス名（class属性の値）の存在を判定
- クラス名（class属性の値）の追加と削除を切り替える
- 属性値の取得
- 属性値の設定
- 属性の存在を確認
- 要素から指定属性名が含まれる属性値を取得
- data属性の値を取得または設定
- 特定の要素からすべての属性を取得
- 要素の横幅と縦幅（高さ）を取得（paddingとborderを含まない）
- 要素の横幅と縦幅（高さ）を取得（paddingとborderを含む）
その他
- ノードタイプを取得
- タグ名を取得
- 複数の要素を繰り返し処理
- 指定要素から子孫要素を含む要素をHTMLの文字列として取得・設定（置き換え）
- 要素に含まれるすべての子孫要素（テキストノードを含む）を取得または設定
- 要素に含まれるすべてのテキストノードを文字列として取得または設定
- HTML文字列をノードに変換
- HTML文字列を特定の位置に挿入
- 要素の値（テキスト）を取得または設定
- 子要素の数を取得
- 子要素が存在するか確認
- 2つの要素が同一であるか確認
- DOCTYPE宣言を取得する
- ある要素からHTMLパンくずリストを取得
- ある要素が指定の要素に属しているか判定
- ある要素から指定するセレクタ―に一致するか判定
- 要素の算出されたスタイルを取得
- 要素の算出されたCSSプロパティの値を取得
- 要素内にあるテキストの行数を取得
- 要素の絶対座標値（位置）を取得
XPath
効果、アニメーション
フォーム
- セレクトボックスの選択されている要素のインデックス番号を取得
- チェックボックスの選択されている要素の状態を取得・設定
- ラジオボタンの選択されている要素の状態を取得・設定
- テキストフィールドの値を取得・設定
- テキストエリアの値を取得・設定
- セレクトボックスの値を取得・設定
- チェックボックスの値を取得・設定
- ラジオボタンの値を取得・設定
- フォームの各入力・選択欄にフォーカスを当てる
- フォームの各入力・選択欄のフォーカスを外す
- フォームの内容をリセット（初期値に戻す）
- フォームの送信
- 二重送信の防止
- 印刷ボタン（印刷ダイアログの表示）
- チェックボックスで入力や選択の可能・不可能の切り替え
- 日付から年齢を自動計算
- セレクトボックスで自動ページ移動（ジャンプ）
- テキストボックス（またはテキストエリア）を全選択
- テキストボックス（またはテキストエリア）の内容をコピー
- セレクトボックス同士の連動
- input要素の選択範囲を設定
画像・図形
画像
- ドキュメント内の全てのimg要素を取得
- img要素からbase64文字列に変換
- マウスオーバー時に画像を切り替える1
- マウスオーバー時に画像を切り替える2
- マウスオーバー時に特定領域の画像を切り替える
- img要素の画像を後から読み込む
- 画像比較スライダー
SVG
Canvas
- canvas要素が利用可能かどうか判定
- canvas要素に矩形（長方形）を描画する
- canvas要素に円や弧を描画する
- canvas要素で星形を描画する
- canvas要素にパス（直線）を描画する
- canvas要素にパス（2次曲線）を描画する
- canvas要素にパス（3次ベジェ曲線）を描画する
- canvas要素で塗りや線に色を適用する
- canvas要素で線の太さを設定する
- canvas要素で破線を描画する
- canvas要素でパスの始点あるいは終点の形状を変更する
- canvas要素でパスの接続している角（線結合）の形状を変更する
- canvas要素に画像や動画を描画する
- canvas要素をData URIとして取得
動画（映像）・音声
音声
動画（映像）
- video要素が利用可能かどうかを判定する
- video要素を再生する
- video要素を一時停止する
- video要素を自動再生するまたは自動再生可能かを取得する
- video要素を繰り返し再生するまたは繰り返し再生かを取得する
- video要素の音量を取得または設定する
- video要素を消音（ミュート）にするまたは消音（ミュート）かを取得する
- video要素の現在の再生時間を取得または再生位置を設定する
- video要素の合計（最大）再生時間を取得する
- video要素の再生速度の変更または取得する
- video要素の操作に関する情報（イベント）を得る
表組（テーブル）
取得
- table要素にあるcaption要素を取得
- table要素にあるthead要素を取得
- table要素にあるtbody要素を取得
- table要素にあるtfoot要素を取得
- table要素に行（tr要素）を取得
生成・追加
- table要素にcaption要素を生成・追加
- table要素にthead要素を生成・追加
- table要素にtbody要素を生成・追加
- table要素にtfoot要素を生成・追加
- table要素に行（tr要素）を追加
- table要素にある行（tr要素）にセル（td要素）を追加
削除
日付、時間、季節
- 現在の日時を取得・表示（ローカル時間）
- 現在の日時をリアルタイムで取得・表示（ローカル時間）
- 午前（AM）または午後（PM）の取得
- 何日前、何日後の取得
- 月末の取得
- 正常な日付かチェック
- 季節によって異なるメッセージを表示
- セレクトボックスの日付を切り替え
- 時間（hh:mm:ss）同士の計算
- 和暦から西暦へ変換
- 西暦から和暦へ変換
- 日時が指定範囲の日時であるか判定
- 一定時間毎に処理を実行
- 指定時間経過後に処理を実行
ウィジェット
ウィンドウ・フレーム
- ウィンドウ内周（表示領域）の横幅と縦幅（高さ）を取得
- ウィンドウ外周の横幅と縦幅（高さ）を取得
- ウィンドウの位置を取得
- ウィンドウの現在のスクロール位置を取得
- 現在のウィンドウの縦横幅を変更する
- 現在のウィンドウの位置を変更する
- ウィンドウを手前に表示
- ウィンドウを背面に表示
- 現在のウィンドウを閉じる
- ウィンドウが閉じられているか判定
- サブウィンドウ（ポップアップ）を開く
- 開いた元のウィンドウのwindowオブジェクトを取得
- 現在のウィンドウまたはサブフレームから親ウィンドウのwindowオブジェクトを取得
- 最上位のウィンドウを取得
- ウィンドウがフルスクリーンモードで表示されているか判定
- ウィンドウを震わせる
- モーダルウィンドウの実装
フレーム
ページ・パス
- 現在開いているページのURLを取得、またはページを移動
- アクセス元（リファラー）ページのURLを取得
- 現在開いているページのURLでクエリ文字列（URLパラメーター）を取得
- 現在開いているページのホスト名を取得
- 現在開いているページのハッシュを取得・設定
- 現在開いているページを再読み込みする
- 現在開いているページの最終更新日を取得
- 現在開いているページのタイトル（title要素の値）を取得または設定
- 現在開いているページの文字コードを取得
- URLの文字列からホスト名を取得
- URLの文字列にクエリ文字列（URLパラメーター）を追加
- URLの文字列からクエリ文字列（URLパラメーター）を配列で取得
- URLの文字列にクエリ文字列（URLパラメーター）のキーの存在を確認
- URLの文字列にあるクエリ文字列（URLパラメーター）に指定する値の存在を確認
- URLの文字列から認証用のユーザー名とパスワードを取得
- URLの文字列からルート相対パスを取得
- URLを作成したり操作する
- クエリ文字列（URLパラメーター）を作成したり操作する
- a要素からパスの情報を取得
- パス情報の取得
- ブラウザのお気に入り（ブックマーク）に登録
履歴
- 1つ前に閲覧したページへ戻る
- 1つ後に閲覧したページへ進む
- 閲覧したページを指定して移動
- 履歴（ヒストリー）を追加
- 履歴の数を取得
- 現在の履歴（ヒストリー）を置換
- 履歴の変化状態を監視
- 履歴の変化状態を取得
スクロール
データストレージ
Cookie
Web Storage
非同期処理・通信
非同期処理
非同期通信
アラート、ダイアログ（プロンプト）
メニュー、ナビゲーション、タブ
イベント
キーボード
- 押したキーのキーコードを取得
- 押したキーのキー名を取得
- 複数のキーが押された時にAltキーが押されたかを判定
- 複数のキーが押された時にCtrlキーが押されたかを判定
- 複数のキーが押された時にShiftキーが押されたかを判定
スタイルシート
- ページに反映されているすべてのスタイルシートを配列（オブジェクト）で取得
- 設定されているルールを配列（オブジェクト）で取得
- 設定されているセレクターとルールのセットを文字列で取得
- 設定されているセレクターを取得
- 設定されているルールを取得
- ルールの追加
- ルールの削除
- スタイルシートの切り替え
アニメーション
物理
デバイス情報
- ユーザーエージェントの取得
- Internet Explorer（IE）のバージョンを取得
- スクリーン（モニター）の解像度を取得
- スクリーン（モニター）の色数をビットで取得
- デバイスの回転方向を取得
- デバイスのピクセル比を取得
- オンラインかどうかを判定
- バッテリーの情報を取得
- センサーによる加速度を求める
- センサーによる重力加速度を求める
- ジャイロセンサーの値を取得
- フォントのアンチエイリアスの検出
マウスカーソル・タッチ