C#
日本の企業・官公庁が公開している無料API
JavaScript
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列のコピー方法
配列のコピーとは何か配列のコピーは「元の配列を壊さず、別の配列インスタンスを作る」ことです。ここが重要です：コピーには“浅いコピー”（一次元ぶんだけ独立）と“深いコピー”（入れ子の中身まで独立）があり...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列の初期化方法
配列の初期化とは何か配列の初期化は「配列を作って、最初の中身（要素）や長さを決める」ことです。ここが重要です：JavaScript では複数の初期化方法がありますが、意図と挙動が微妙に違います。最も安...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列と文字列の違い
配列と文字列とは何か配列は「値を順番に並べるための入れ物」、文字列は「文字を順番に並べたテキスト」です。どちらも“順序がある並び”ですが、決定的な違いがあります。ここが重要です：配列は変更可能（要素の...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 多次元配列
多次元配列とは何か多次元配列は「配列の中に配列を入れた構造」です。2次元は行と列、3次元はさらに“層”があるイメージになります。ここが重要です：JavaScriptには専用の多次元型はなく、配列の入れ...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列の変更可能性
配列の変更可能性とは何か配列は「参照型のオブジェクト」で、デフォルトでは中身を自由に変更できます。push・pop・splice・sort などのメソッドは配列を“その場で書き換える”ため、同じ配列を...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列の参照渡し
配列の参照渡しとは何か配列は「参照型」のオブジェクトです。変数が直接値そのものを持つのではなく、“配列がある場所（参照）”を指しています。ここが重要です：代入や関数引数で配列を渡すと、“配列そのもの”...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – length プロパティ
length プロパティとは何かlength プロパティは「配列の要素数」を表す特別な値です。配列に何個の要素が入っているかを常に返してくれます。ここが重要です：length は「最後のインデックス ...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – インデックスの概念
インデックスとは何かインデックスは「配列の中で、要素に付いている番号」です。JavaScript では先頭が 0、次が 1…と続きます。ここが重要です：配列の要素数（length）とインデックスの最大...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列リテラル
配列リテラルとは何か配列リテラルは、角括弧 は数値の配列、 は型が混在した配列になります。ここが重要です：JavaScript の配列はどんな型でも混ぜられ、長さは後から自由に伸び縮みします。new ...
JavaScript JavaScript | 配列・オブジェクト：配列の基礎 – 配列とは何か
配列とは何か配列は「値を順番に並べて、ひとまとめに扱うための箱」です。1つの変数に複数の値を入れて、後から順番や番号（インデックス）で取り出せます。ここが重要です：JavaScript の配列は“どん...
JavaScript JavaScript | DOM 操作：フォーム操作 – フォームデータ送信（FormData）
FormData とは何かFormData は、フォームの入力値を「送信用のペア（name → value）」としてまとめるための標準APIです。ファイルも含めて簡単に扱え、fetch などの非同期送...
JavaScript JavaScript | DOM 操作：フォーム操作 – エラー表示の DOM 操作
エラー表示の DOM 操作とは何かフォームの「どこが、なぜ、どう直せばいいか」を画面に明確に示すために、DOM（HTML構造）を動的に追加・更新・削除することです。ここが重要です：ブラウザ標準のバブル...
JavaScript JavaScript | DOM 操作：フォーム操作 – バリデーション（required, pattern など）
バリデーションとは何かバリデーションは「入力が条件を満たしているか」をチェックして、誤入力や欠落を防ぐ仕組みです。HTML とブラウザは、required・type・min/max・pattern な...
JavaScript JavaScript | DOM 操作：フォーム操作 – フォーム送信イベント
フォーム送信イベントとは何かフォーム送信イベントは、ユーザーがフォームを送ろうとした瞬間に発火する “submit” イベントのことです。ここが重要です：submit は「実際の送信前」に発火するため...
JavaScript JavaScript | DOM 操作：フォーム操作 – フォームの reset
フォームの reset とは何かフォームの reset は「フォーム内のすべての入力を“初期状態（HTMLで指定された値・選択）”に戻す」操作です。ここが重要です：reset は“現在値”ではなく“初...
JavaScript JavaScript | DOM 操作：フォーム操作 – ラジオボタンの取得
ラジオボタンの取得とは何かラジオボタンは「同じ name を持つ選択肢の中から“必ず0か1つ”だけ選ぶ」入力です。JavaScript では“グループとして”扱うのがコツです。ここが重要です：同じ n...
JavaScript JavaScript | DOM 操作：フォーム操作 – checked の操作
checked とは何かchecked は、checkbox と radio の「選択状態」を表す真偽値プロパティです。true なら選ばれている、false なら選ばれていない状態を意味します。ここ...
JavaScript JavaScript | DOM 操作：フォーム操作 – select の取得・変更
select の取得・変更とは何かselect は「選択肢の中から値を1つ（または複数）選ぶ」ためのフォーム要素です。JavaScript では現在の選択値を読み取ったり、選択を変更したり、選択肢を動...
JavaScript JavaScript | DOM 操作：フォーム操作 – input の value
input の value とは何かinput 要素の value は「現在の入力値」を表す文字列です。type に関わらず、基本は文字列として読み書きします。ここが重要です：type="number...
JavaScript JavaScript | DOM 操作：フォーム操作 – フォーム要素の取得
フォーム要素の取得とは何かフォーム要素の取得は、HTML の form や input・select・textarea・button などにプログラムからアクセスして、値を読んだり書いたり、送信を制御...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – スクロール固定（overflow: hidden）
スクロール固定（overflow: hidden）とは何か「スクロール固定」は、ユーザーがスクロールできない状態にすることです。最も簡単な方法は、対象要素（よくあるのは body）に overflow...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – boundingClientRect
getBoundingClientRect とは何かgetBoundingClientRect は、要素の「画面（ビューポート）に対する位置とサイズ」を返すメソッドです。返ってくる値は小数を含む CS...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – ビューポートとは
ビューポートとは何かビューポートは「今、ユーザーに見えている画面の領域」です。ページ全体（ドキュメント）の中で、スクロールせずに表示されている矩形がビューポート。ここが重要です：JavaScriptで...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – 画面中央配置
画面中央配置とは何か「画面中央配置」は、要素をビューポート（今見えている画面）のちょうど真ん中に置くことです。モーダル、ダイアログ、ロード中インジケーターなどで頻繁に使います。ここが重要です：中央は「...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – スクロール位置の取得
スクロール位置の取得とは何かスクロール位置の取得は「今、ページや要素がどれだけスクロールされているか」を数値で読み取ることです。縦方向はどれだけ上から下へ動いたか（Top）、横方向は左から右へ動いたか...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – scrollTo / scrollBy
scrollTo / scrollBy とは何かscrollTo と scrollBy は、「スクロール位置をプログラムで動かす」ためのメソッドです。window（ページ全体）にも、スクロール可能な要...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – scrollWidth / scrollHeight
scrollWidth / scrollHeight とは何かscrollWidth と scrollHeight は、「要素のコンテンツが本来必要としている大きさ」を返すプロパティです。visibl...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – clientWidth / clientHeight
clientWidth / clientHeight とは何かclientWidth と clientHeight は、要素の「内側で実際に使える領域」のサイズを整数ピクセルで返すプロパティです。ここ...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – offsetWidth / offsetHeight
offsetWidth / offsetHeight とは何かoffsetWidth と offsetHeight は、要素の「見た目のサイズ」をピクセルで返すプロパティです。ここが重要です：bord...
JavaScript JavaScript | DOM 操作：要素の位置・サイズ・スクロール – offsetTop / offsetLeft
offsetTop / offsetLeft とは何かoffsetTop と offsetLeft は、「その要素が“基準の親”（offsetParent）からどれだけ離れているか」を示すピクセル値で...
JavaScript JavaScript | DOM 操作：イベント発展 – once: true
once: true とは何かonce: true は addEventListener のオプションで、「このリスナーは最初の一回だけ実行し、終わったら自動で取り外す」という宣言です。ここが重要です...
JavaScript JavaScript | DOM 操作：イベント発展 – passive: true
passive: true とは何かpassive: true は、addEventListener のオプションで「このリスナーでは preventDefault を呼ばない」とブラウザに約束する設...
JavaScript JavaScript | DOM 操作：イベント発展 – dispatchEvent
dispatchEvent とは何かdispatchEvent は「イベントを自分で発火させる」ためのメソッドです。DOM 要素や EventTarget に対して、既存のイベント（click など）...
JavaScript JavaScript | DOM 操作：イベント発展 – カスタムイベント
カスタムイベントとは何かカスタムイベントは、あなたが「アプリ内の合図」を自由に作って通知できる仕組みです。DOM の仕組み（addEventListener / dispatchEvent）をそのまま...
JavaScript JavaScript | DOM 操作：イベント発展 – コンテキストメニュー
コンテキストメニューとは何かコンテキストメニューは、右クリック（または長押し）した場所や対象に応じて“その場に適した操作”を提示するための UI です。ブラウザ標準のメニューを表示するイベントは co...
JavaScript JavaScript | DOM 操作：イベント発展 – スクロールイベント
スクロールイベントとは何かスクロールイベントは、ページや特定のスクロール可能な要素のスクロール位置が変わった瞬間に発火する合図です。window（ページ全体）にも、overflow: auto などで...
JavaScript JavaScript | DOM 操作：イベント発展 – フォーカスイベント
フォーカスイベントとは何かフォーカスイベントは「どの要素がキーボード操作の対象になったか／外れたか」を知らせる合図です。代表は focus（入る）、blur（出る）、そしてバブリングする仲間の foc...
JavaScript JavaScript | DOM 操作：イベント発展 – イベント委譲
イベント委譲とは何かイベント委譲は、「たくさんの子要素それぞれにリスナーを付けず、親に1つだけ付けて子の操作に反応する」設計です。イベントがバブル（内側→外側）で伝わる仕組みを利用し、親のリスナー内で...
JavaScript JavaScript | DOM 操作：イベント発展 – イベント伝播（キャプチャ / バブル）
イベント伝播とは何か（キャプチャ／バブルの全体像）イベント伝播は「ある要素で起きたイベントが、DOM ツリーの上下へ段階的に届く仕組み」です。段階は「キャプチャ（外側→内側）→ターゲット（実際の要素）...
JavaScript JavaScript | DOM 操作：イベント発展 – stopPropagation
stopPropagation とは何かstopPropagation は「イベントが親要素へ伝わっていく流れ（伝播）を止める」ためのメソッドです。クリックなどのイベントは、最初に操作された要素から外...
JavaScript JavaScript | DOM 操作：イベント基礎 – preventDefault
preventDefault とは何かpreventDefault は「イベントのデフォルト動作（ブラウザが標準で行う処理）」をキャンセルするためのメソッドです。例えばリンクの遷移、フォームの送信、ス...
JavaScript JavaScript | DOM 操作：イベント基礎 – イベントのデフォルト動作
イベントのデフォルト動作とは何か「イベントのデフォルト動作」は、ブラウザが標準で行う振る舞いのことです。例として、リンクのクリックでページ遷移、フォームの submit で送信、テキスト入力で Ent...
JavaScript JavaScript | DOM 操作：イベント基礎 – submit
submit とは何かsubmit は「フォームが送信される瞬間」に発火するイベントです。Enter キーや type="submit" のボタンで送信しようとしたとき、フォーム要素で受け取れます。こ...
JavaScript JavaScript | DOM 操作：イベント基礎 – input / change
input と change とは何かinput と change は、フォーム要素の値が変わったときに発火するイベントです。input は「値が変わるたびに逐次発火」、change は「確定したタイ...
JavaScript JavaScript | DOM 操作：イベント基礎 – キーボードイベント（keydown / keyup）
キーボードイベントとは何か（keydown / keyup）keydown は「キーが押された瞬間」、keyup は「キーが離された瞬間」に発火するイベントです。ショートカット、ゲームの操作、フォーム...
JavaScript JavaScript | DOM 操作：イベント基礎 – マウスイベント（click / dblclick / mouseover）
マウスイベントの基礎（click / dblclick / mouseover）マウスイベントは「ユーザーの操作」をコードへ橋渡しする合図です。click は単押し、dblclick は素早い二連続ク...
JavaScript JavaScript | DOM 操作：イベント基礎 – target と currentTarget
target と currentTarget とは何かイベントオブジェクトの target は「実際に操作された最も内側の要素」、currentTarget は「そのイベントリスナーが登録されている要...
JavaScript JavaScript | DOM 操作：イベント基礎 – イベントオブジェクト
イベントオブジェクトとは何かイベントオブジェクト（一般に e と書く）は、「何が、どこで、どのように起きたか」の詳細を持つ“出来事の記録”です。addEventListener のコールバックに渡され...
JavaScript JavaScript | DOM 操作：イベント基礎 – removeEventListener
removeEventListener とは何かremoveEventListener は、addEventListener で登録したイベントリスナーを「取り外す」ためのメソッドです。特定の要素（ま...
JavaScript JavaScript | DOM 操作：イベント基礎 – addEventListener
addEventListener とは何かaddEventListener は「イベントが起きたときに実行する処理（リスナー）を登録する」ためのメソッドです。クリック、入力、スクロール、ロードなど、ブ...
JavaScript JavaScript | DOM 操作：ノード操作 – prepend
prepend とは何かprepend は、親ノードの「先頭」にコンテンツを追加するメソッドです。ノード（要素やテキストノード）だけでなく、文字列も直接渡せ、さらに複数の引数を一度に追加できます。ここ...
JavaScript JavaScript | DOM 操作：ノード操作 – append
append とは何かappend は、親ノードの「末尾」にコンテンツを追加するためのメソッドです。ノード（要素やテキストノード）だけでなく、文字列も直接渡せるのが特徴です。ここが重要です：appen...
JavaScript JavaScript | DOM 操作：ノード操作 – remove（直接削除）
remove とは何か（直接削除のイメージ）remove は、要素自身が「自分を親から切り離して画面から消える」ためのメソッドです。document.getElementById("x").remov...
JavaScript JavaScript | DOM 操作：ノード操作 – fragment の利用
DocumentFragment とは何かDocumentFragment（以下フラグメント）は、DOM に一時的に要素を“まとめて保持するための入れ物”です。画面（実DOM）にまだ接続されていないミ...
JavaScript JavaScript | DOM 操作：ノード操作 – cloneNode
cloneNode とは何かcloneNode は、既存の DOM ノード（要素やテキスト）を“複製”するメソッドです。形は node.cloneNode(deep)。ここが重要です：deep が f...
JavaScript JavaScript | DOM 操作：ノード操作 – replaceChild
replaceChild とは何かreplaceChild は「親ノードの子を別のノードに置き換える」メソッドです。形は parent.replaceChild(newChild, oldChild)...
JavaScript JavaScript | DOM 操作：ノード操作 – removeChild
removeChild とは何かremoveChild は「親ノードから指定した子ノードを取り外す」メソッドです。形は parent.removeChild(child)。画面から消えるだけでなく、D...
JavaScript JavaScript | DOM 操作：ノード操作 – insertBefore
insertBefore とは何かinsertBefore は「親ノードの中で、指定した子ノードの“直前”に新しいノードを挿入する」メソッドです。形は parent.insertBefore(newN...
JavaScript JavaScript | DOM 操作：ノード操作 – appendChild
appendChild とは何かappendChild は、親ノードの「末尾」に子ノードを追加するメソッドです。DOM で新しく作った要素（createElement）や既存の要素を、指定した親の最後...
JavaScript JavaScript | DOM 操作：ノード操作 – createElement
createElement とは何かcreateElement は、JavaScript で新しい HTML 要素を“ゼロから”作るためのメソッドです。たとえば div、button、img、li な...