JavaScriptのテキスト(新版)

JavaScriptのテキスト(PDF:305ページ,2.34MB)

まだ試作品(プレビュー版)です.ご意見くださいませ.

コメントはこのページの最下部から投稿できます.

a>
Container01.html Container02.html Table01.html
ImgElement01.html IMGobj01.png OpacityVisivility01.html
ErrorTest01.html ErrorTest02.html ErrorTest03.html
ErrorTest04.js
JShtml00.html JShtml00-1.html JShtml00-1.js
DOMtest01.html DOMtest02.html CSStest01.html
Event01.html Event01-2.html Event01-3.html
Event02.html Event03.html Timer01.html
BallGray01.gif ContentSize01.html ScreenRatio01.html
PosAndSize01.html StorageTest01.html ImageTest01.html
ImageTest01.html ImageTest01_1.gif ImageTest01_2.gif
ImageTest01_3.gif ImageTest01-0.html MediaPlay01.html
sound01.mp3
longTask01.js Promise01-1.html Promise01-2.html
base64jsTest01.html
InputTypeFile01.html FileReader01.html FileReader01.txt
FileReader02.html Download01.html
DnD01_0.html DnD01_2.html multiScript01.html
multiScript01-1.js multiScript01-2.js moduleTest01.html
moduleTest01.js moduleTest02.js moduleTest02-2.js
moduleTest02.html moduleTest03.html moduleTest03.js
nsTest03_1.js nsTest03_2.js moduleTest04.html
moduleTest04.js nsTest04_1.js nsTest04_2.js
WebWorker00.html Worker00.js WebWorker01.html
Worker01.js WebWorker02.html Worker02.js
FetchTest01.txt FetchTest01.json FetchTest01.html
Canvas04.html Canvas01.html Canvas05.html
Canvas06.html Canvas07.html JavaScript_Ilst.png
Canvas08.html Canvas09.html Canvas10.html
SVG00.svg SVG00.html SVG00-2.html
SVG00-2.svg SVG01-1.svg SVG02-1.svg
SVG02-2.svg SVG02-3.svg SVG02-4.svg
SVG03-1.svg SVG03-2.svg SVG03-3.svg
SVG03-4.svg SVG03-5.svg SVG02-5.svg
SVG02-5-2.svg SVG02-6.svg SVG02-6-2.svg
SVG02-6-3.svg SVG02-6-4.svg AxisPlane.png
SVG04-03.svg SVG04-01.svg SVG04-02.svg
SVG04-04.svg SVG05-1.svg SVG05-2.svg
jQuery00.html jQuery04.html jQuery05-1.html
jQuery05-2.html jQuery05-4.html jQuery05-3.html
jQuery02.html jQuery03.html jQuery06.html
jquery_icon.png jQuery07.html jQuery08.html
mathjax01-1.html mathjax01-2.html
reactTest01.html reactTest02.html reactTest03.html
reactTest04.html BallGray02.png reactTest05.html
reactTest05-2.html reactTest05-3.html reactTest06.html
reactTest07.html reactTest08.html
buildTest02/index.html buildTest02/src/index.js buildTest02/.babelrc
buildTest02/webpack.config.js buildTest02/package.json
buildTest05/index.html buildTest05/src/index.js buildTest05/src/comp1.js
buildTest05/src/comp2.js buildTest05/webpack.config.js
buildTest02-2/index.html buildTest02-2/src/index.js
NodeHTTPsv01.js NodeHTTPsv02.js NodeHTTPsv02.html
ExpressSv01.js ExpressSv02.js ExpressSv02.html
ExpressSv03.js
PythonHTTPsv01.py PythonHTTPsv01.html FlaskSv01.py
FlaskSv02.py FlaskSv03.py FlaskSv03-04.html
FlaskSv04.py
MyHomePage.html nodeCGI01.js pythonCGI01.py
nodeCGI02.js nodeCGI02.html pythonCGI02.py
pythonCGI02.html
wsgiApp01.wsgi wsgiApp02.wsgi wsgiApp02.html
WebSocketSV01.js WebSocketCL01.html WebSocketSV02.js
WebSocketCL02-1.html WebSocketCL02-2.html
PythonWSsv01.py PythonWScl01.html PythonWSsv02.py
NodeInput.js

1 はじめに — 1
  1.1 本書の内容 — 1
  1.2 前提事項 — 1
  1.3 サンプルコードの提示に関すること — 1
2 HTMLとCSS — 2
  2.1 HTML — 2
    2.1.1 HTMLの要素 — 2
      2.1.1.1 HTML要素の属性 — 2
    2.1.2 HTMLの基本的な構成 — 2
      2.1.2.1 文書型宣言 — 2
      2.1.2.2 html要素 — 3
      2.1.2.3 head要素 — 3
      2.1.2.4 body要素:文書本体要素 — 3
    2.1.3 HTML文書の論理的構造 — 3
      2.1.3.1 文書のレイアウトのための要素 — 4
      2.1.3.2 記事の論理構造 — 4
      2.1.3.3 まとめ — 4
    2.1.4 HTML文書内のコメント — 4
  2.2 CSS — 4
    2.2.1 セレクタ — 5
    2.2.2 サイズや色の値の表現 — 5
    2.2.3 CSSのコメント — 6
  2.3 HTML,CSS各論 — 6
    2.3.1 見出しと段落: h要素,hgroup要素,p要素 — 6
      2.3.1.1 span要素 — 7
      2.3.1.2 hgroup要素 — 7
      2.3.1.3 文字,テキストに関する設定 — 7
      2.3.1.4 文字の書体(フォント)に関する設定 — 9
      2.3.1.5 ルビ — 11
    2.3.2 ハイパーリンクの設置 — 11
      2.3.2.1 a要素に対する特殊なセレクタ — 12
    2.3.3 HTML要素のレイアウト — 12
      2.3.3.1 HTML要素をレイアウトするためのボックス構造 — 14
      2.3.3.2 div要素 — 15
      2.3.3.3 レイアウトと包含ブロック — 15
      2.3.3.4 要素の位置について — 16
      2.3.3.5 ボックス構造の位置とサイズに関すること — 17
      2.3.3.6 コンテナ内外のレイアウト制御 — 19
    2.3.4 箇条書き: ul要素,ol要素,li要素 — 19
    2.3.5 表: table要素 — 20
      2.3.5.1 thead,tbody,ifoot 要素 — 21
    2.3.6 画像の埋め込み: img要素 — 21
    2.3.7 不透明度 — 22
    2.3.8 可視属性 — 22
    2.3.9 form要素 — 22
      2.3.9.1 form 要素の記述形式とWebサーバとの連携 — 23
      2.3.9.2 form要素に依らないUI構築 — 23
      2.3.9.3 ラベル — 23
      2.3.9.4 テキスト入力(1):単一行の入力 — 23
      2.3.9.5 テキスト入力(2):複数行の入力 — 24
      2.3.9.6 パスワード入力 — 24
      2.3.9.7 ボタン — 24
      2.3.9.8 スライダ — 24
      2.3.9.9 データリスト要素 — 25
      2.3.9.10 選択要素 — 26
      2.3.9.11 チェックボックス — 26
      2.3.9.12 ラジオボタン — 27
      2.3.9.13 フィールドセット要素 — 27
      2.3.9.14 メータと進捗インジケータ(プログレスバー) — 28
    2.3.10 外部リソースへのリンク要素 — 29
    2.3.11 スタイルシートの形態 — 29
3 JavaScript — 30
  3.1 前提事項 — 30
    3.1.1 コンソール出力 — 30
    3.1.2 文を複数の行に分割して記述する方法 — 31
    3.1.3 プログラム中のコメント — 31
  3.2 文とブロック — 31
  3.3 関数,メソッド,プロパティ — 31
  3.4 変数 — 32
    3.4.1 変数のスコープ — 32
    3.4.2 変数の使用における良くない例 — 33
      3.4.2.1 更に注意すべき事柄 — 34
    3.4.3 変数の廃棄 — 34
  3.5 基本的なデータ型 — 35
    3.5.1 数値 — 35
      3.5.1.1 基本的な演算 — 35
      3.5.1.2 累算的な代入演算子 — 36
      3.5.1.3 特殊な値 — 36
      3.5.1.4 長整数: BigInt — 37
      3.5.1.5 数値リテラル — 38
      3.5.1.6 数学関数 — 38
    3.5.2 論理値 — 39
    3.5.3 文字列 — 39
      3.5.3.1 エスケープシーケンス — 40
      3.5.3.2 複数行に渡る文字列の記述 — 41
      3.5.3.3 文字列の長さ(文字数) — 41
      3.5.3.4 文字列の連結と分解 — 41
      3.5.3.5 文字列の繰り返し — 42
      3.5.3.6 部分文字列 — 42
      3.5.3.7 文字列の含有検査 — 43
      3.5.3.8 テンプレートリテラル(テンプレート文字列) — 43
      3.5.3.9 文字列を数値に変換する方法 — 44
    3.5.4 シンボル — 45
    3.5.5 値の比較 — 46
    3.5.6 値の型に関すること — 46
  3.6 データ構造 — 48
    3.6.1 配列:Array — 48
      3.6.1.1 空配列 — 49
      3.6.1.2 要素の追加 — 49
      3.6.1.3 要素の削除 — 50
      3.6.1.4 配列の連結 — 51
      3.6.1.5 部分配列 — 51
      3.6.1.6 配列の編集 — 51
      3.6.1.7 配列の反転 — 52
      3.6.1.8 要素の整列 — 52
      3.6.1.9 指定した要素を配列内に並べる方法 — 53
      3.6.1.10 要素の存在や位置の調査 — 53
      3.6.1.11 配列の並びを表す文字列の取得 — 54
      3.6.1.12 全要素に対する条件検査 — 54
      3.6.1.13 条件を満たす要素の探索 — 55
      3.6.1.14 特殊なプロパティ — 56
    3.6.2 オブジェクト:Object — 56
      3.6.2.1 要素の削除 — 57
      3.6.2.2 プロパティのキーに使用できるデータ — 57
      3.6.2.3 空オブジェクト — 57
      3.6.2.4 オブジェクトから配列への変換 — 57
      3.6.2.5 オブジェクトの要素の個数を求める方法 — 58
    3.6.3 Mapオブジェクト — 59
      3.6.3.1 要素へのアクセス — 59
      3.6.3.2 要素の存在確認 — 59
      3.6.3.3 要素の個数の調査 — 60
      3.6.3.4 全要素の取出し — 60
      3.6.3.5 要素の削除 — 60
      3.6.3.6 ミュータブルなデータをキーに使用する際の注意 — 61
    3.6.4 Setオブジェクト — 62
      3.6.4.1 要素の存在確認 — 62
      3.6.4.2 要素の追加と削除 — 62
      3.6.4.3 要素の個数の調査 — 62
      3.6.4.4 配列への変換 — 63
      3.6.4.5 全要素の削除 — 63
      3.6.4.6 ミュータブルなデータを要素にする際の注意 — 63
    3.6.5 スプレッド構文 — 64
  3.7 特殊なデータ構造 — 65
    3.7.1 型付き配列(TypedArray)とArrayBuffer — 65
      3.7.1.1 ArrayBufferの複数のビューによる共有 — 66
      3.7.1.2 バイトオーダー(リトルエンディアン/ビッグエンディアン) — 67
    3.7.2 データビュー(DataView) — 68
    3.7.3 文字列⇔バイナリデータの変換 — 70
      3.7.3.1 Node.jsでの方法 — 70
    3.7.4 Blob — 71
      3.7.4.1 Blob 作成の例 — 71
      3.7.4.2 Blob のデータの取り出し — 72
    3.7.5 BinaryString — 72
      3.7.5.1 Blobとの間での変換 — 72
  3.8 条件分岐 — 73
    3.8.1 if … else 文 — 73
    3.8.2 switch 文 — 74
    3.8.3 値を選択する3項演算子 — 75
    3.8.4 論理値以外を条件式に用いるケース — 75
  3.9 反復制御 — 77
    3.9.1 while 文 — 77
    3.9.2 do … while 文 — 77
    3.9.3 for 文 — 78
      3.9.3.1 for … of 文 — 78
      3.9.3.2 for … in 文 — 79
    3.9.4 breakとcontinue — 80
  3.10 関数の定義 — 81
    3.10.1 変数のスコープ — 81
      3.10.1.1 変数の使用における安全でない例 — 82
    3.10.2 引数に関する事柄 — 83
      3.10.2.1 仮引数と実引数 — 83
      3.10.2.2 任意の個数の引数を扱う方法 — 83
      3.10.2.3 仮引数にデフォルト値を設定する方法 — 83
    3.10.3 関数自体のスコープ — 84
    3.10.4 関数式 — 85
      3.10.4.1 即時実行関数 — 85
      3.10.4.2 アロー関数式 — 85
    3.10.5 関数の再帰的呼び出し — 86
    3.10.6 ネストされた関数定義(内部関数) — 87
      3.10.6.1 クロージャ — 87
  3.11 オブジェクト指向プログラミング(OOP) — 90
    3.11.1 メソッドの実装 — 91
      3.11.1.1 prototypeプロパティ — 91
    3.11.2 インスタンスのコンストラクタを調べる方法 — 92
    3.11.3 Object.createによるオブジェクトの生成 — 92
    3.11.4 プロパティ継承の仕組み — 92
    3.11.5 class構文による方法 — 95
      3.11.5.1 コンストラクタ,メソッドの記述 — 96
      3.11.5.2 パブリックフィールド — 96
      3.11.5.3 静的メソッド — 97
      3.11.5.4 クラスの継承 — 98
      3.11.5.5 オブジェクトのクラスを調べる方法 — 99
      3.11.5.6 プロパティのカプセル化 — 100
      3.11.5.7 class式 — 100
  3.12 日付,時刻の扱い — 102
    3.12.1 現在時刻の取得 — 102
    3.12.2 値の取得と設定 — 102
    3.12.3 データ形式の変換 — 103
      3.12.3.1 Dateオブジェクト→文字列 — 103
      3.12.3.2 文字列→Dateオブジェクト — 104
  3.13 正規表現 — 105
    3.13.1 文字列探索(検索) — 105
      3.13.1.1 RegExpオブジェクト — 106
    3.13.2 パターンマッチ — 106
      3.13.2.1 マッチした部分の抽出 — 106
      3.13.2.2 行頭,行末でのパターンマッチ — 107
      3.13.2.3 パターンマッチの繰り返し実行 — 107
      3.13.2.4 複数行のテキストに対するパターンマッチ — 107
    3.13.3 置換処理 — 108
  3.14 例外処理 — 110
    3.14.1 エラーオブジェクト — 110
      3.14.1.1 例外(エラー)の種類 — 111
    3.14.2 例外を発生させる方法 — 112
  3.15 その他の便利な機能 — 114
    3.15.1 forEachによる反復処理 — 114
    3.15.2 配列の全要素に対する一斉処理 — 115
      3.15.2.1 対象要素のインデックスを取得する方法 — 115
    3.15.3 配列に対する二項演算の連鎖的実行 — 116
4 Webアプリケーション開発のための基礎 — 117
  4.1 HTMLとJavaScript — 117
  4.2 DOMに基づいたプログラミング — 118
    4.2.1 DOMの最上位のオブジェクト — 118
      4.2.1.1 グローバル変数の所在 — 118
    4.2.2 HTMLの最上位のオブジェクト — 118
    4.2.3 HTML要素のクラス — 118
    4.2.4 HTMLの木構造(階層構造) — 119
      4.2.4.1 子要素,親要素を取得する方法 — 119
      4.2.4.2 document直下の子要素 — 120
      4.2.4.3 childNodesプロパティ — 120
    4.2.5 HTML要素のid属性から要素ノードを取得する方法 — 121
    4.2.6 HTML要素の要素名(タグ名)の取得 — 121
    4.2.7 HTML要素の生成 — 121
      4.2.7.1 HTML要素の属性を設定する方法 — 122
      4.2.7.2 HTML要素の属性を取得する方法 — 122
      4.2.7.3 HTML要素のデータ属性 — 122
    4.2.8 テキストノードの作成 — 123
    4.2.9 子ノードの追加 — 123
      4.2.9.1 子ノードの追加位置の指定 — 123
    4.2.10 子ノードの削除 — 125
    4.2.11 HTML要素にテキストコンテンツを与える方法 — 125
    4.2.12 HTML要素のclass属性から要素ノードを取得する方法 — 125
    4.2.13 DOMParser — 127
    4.2.14 CSSのセレクタからHTML要素を取得する方法 — 128
  4.3 JavaScriptでCSSにアクセスする方法 — 129
    4.3.1 HTML要素のスタイルの取得 — 129
    4.3.2 スタイルの動的な変更 — 129
      4.3.2.1 styleプロパティ配下のCSS属性名に関する注意 — 130
  4.4 イベント駆動型プログラミング — 131
    4.4.1 イベントハンドリングの仕組み — 131
    4.4.2 イベントの種類 — 132
      4.4.2.1 ページの読込み,離脱 — 132
      4.4.2.2 マウスの操作 — 132
      4.4.2.3 キーボードの操作 — 132
      4.4.2.4 変化や選択によって発生するイベント — 132
      4.4.2.5 その他のイベント — 133
    4.4.3 addEventListenerによるイベントハンドラの登録 — 133
    4.4.4 イベント名のプロパティにイベントハンドラを登録する方法 — 134
    4.4.5 イベントオブジェクト — 134
      4.4.5.1 イベントオブジェクトの使用例(マウス関連) — 135
      4.4.5.2 イベントオブジェクトの使用例(キーボード関連) — 136
    4.4.6 タイマー — 137
      4.4.6.1 タイマー処理の反復 — 137
      4.4.6.2 タイマーの反復処理の応用例 — 138
  4.5 表示環境に関する事柄 — 139
    4.5.1 ディスプレイ(スクリーン)関連 — 139
    4.5.2 ブラウザウィンドウ,コンテンツページ関連 — 139
    4.5.3 表示の解像度を求める方法 — 140
    4.5.4 px(ピクセル)からpt(ポイント)への単位の変換 — 141
    4.5.5 ビューポート内でのHTML要素の位置とサイズ — 142
  4.6 ローカル環境でのデータの保存 — 144
    4.6.1 localStorage — 144
      4.6.1.1 データの保存 — 144
      4.6.1.2 データの取得 — 145
      4.6.1.3 キーの取得 — 145
      4.6.1.4 サンプルプログラム:全データの取得 — 146
      4.6.1.5 データの消去 — 146
    4.6.2 sessionStorage — 146
  4.7 画像,音声の扱い — 147
    4.7.1 静止画像の扱い — 147
      4.7.1.1 静止画像を動的に切り替える方法 — 147
      4.7.1.2 img要素の生成と追加 — 147
    4.7.2 音声,動画の扱い — 149
      4.7.2.1 HTMLMediaElementクラス — 149
      4.7.2.2 再生と一時停止 — 149
      4.7.2.3 各種のプロパティ — 149
      4.7.2.4 各種のイベント — 150
      4.7.2.5 動画:HTMLVideoElementオブジェクト — 150
      4.7.2.6 応用例 — 151
  4.8 非同期処理とPromise — 152
    4.8.1 Promiseオブジェクト — 152
    4.8.2 実装例 — 153
  4.9 JSON — 157
    4.9.1 JSONデータの作成 — 157
    4.9.2 JSONデータの展開 — 157
  4.10 通信のためのデータ変換 — 158
    4.10.1 URLエンコーディング — 158
    4.10.2 Base64 — 158
      4.10.2.1 base64-jsライブラリ — 159
  4.11 ファイルの入出力 — 161
    4.11.1 ファイルの読込み — 161
      4.11.1.1 input要素によるファイル選択ダイアログ — 161
      4.11.1.2 FileReaderによるファイルの読込み — 162
    4.11.2 ファイルの保存 — 164
  4.12 ドラッグアンドドロップ — 166
    4.12.1 ドラッグアンドドロップに伴う処理 — 166
      4.12.1.1 dragstart イベントを受けて行う処理 — 167
      4.12.1.2 dragover イベントを受けて行う処理 — 167
      4.12.1.3 drop イベントを受けて行う処理 — 167
      4.12.1.4 イベントオブジェクトの target 属性 — 167
  4.13 プログラムの分割開発 — 169
    4.13.1 単純な分割開発 — 169
    4.13.2 モジュールによる分割開発 — 169
      4.13.2.1 モジュール内のオブジェクトを公開する方法(1):DOMを介する — 170
      4.13.2.2 モジュール内のオブジェクトを公開する方法(2):exportで公開する — 170
      4.13.2.3 モジュール毎の名前空間を実現するための工夫 — 171
5 Web Workers — 174
  5.1 基本的な考え方 — 174
    5.1.1 ワーカーのプログラミングの考え方 — 174
  5.2 ワーカーの並行実行 — 176
  5.3 メッセージ送信におけるデータの複製と移転 — 178
6 通信のための機能 — 180
  6.1 Fetch API — 180
    6.1.1 基本的な通信の手順 — 180
    6.1.2 Promiseによる非同期処理 — 180
    6.1.3 サーバからの応答の解析 — 181
    6.1.4 応答からのデータ本体の取り出し — 181
    6.1.5 例外処理 — 181
    6.1.6 Fetch API の使用例 — 182
7 グラフィックスの作成(1):canvas要素 — 184
  7.1 座標と角度の考え方 — 184
  7.2 描画領域のサイズ — 184
  7.3 描画コンテキスト — 185
    7.3.1 フィルに関する描画の設定 — 185
    7.3.2 輪郭線に関する描画の設定 — 185
      7.3.2.1 線幅(線の太さ)と始点,終点の座標の考え方 — 185
      7.3.2.2 線の端の形状の設定 — 185
      7.3.2.3 線の結合部の形状の設定 — 185
      7.3.2.4 破線の設定 — 186
  7.4 描画メソッド — 187
    7.4.1 矩形(四角形)の描画 — 187
    7.4.2 テキストの描画 — 187
      7.4.2.1 矩形とテキストを描画するサンプル — 187
    7.4.3 パスの描画 — 188
      7.4.3.1 折れ線の描画 — 188
      7.4.3.2 円弧の描画 — 190
      7.4.3.3 楕円弧の描画 — 191
    7.4.4 画像の描画 — 192
    7.4.5 画素(ピクセル)の描画と取得 — 193
      7.4.5.1 ImageDataオブジェクトの画素の構造 — 193
      7.4.5.2 ImageDataオブジェクトの描画 — 193
      7.4.5.3 canvasから画素を取得する方法 — 195
  7.5 スケール,傾き,原点の変更 — 195
    7.5.1 描画コンテキストの状態の保存と復元 — 196
8 グラフィックスの作成(2):SVG — 197
  8.1 基礎事項 — 197
    8.1.1 座標系と大きさ,角度の単位 — 197
    8.1.2 記述の形式 — 197
    8.1.3 ビューポートとビューボックス — 197
    8.1.4 HTMLへのSVGの配置 — 198
      8.1.4.1 img要素として配置する方法 — 198
      8.1.4.2 object要素として配置する方法 — 199
    8.1.5 defs要素による定義の再利用 — 200
  8.2 SVGの図形要素 — 201
    8.2.1 多角形,折れ線 — 201
    8.2.2 輪郭線に関する設定事項 — 202
      8.2.2.1 破線の設定 — 202
      8.2.2.2 線の端の形状の設定 — 203
      8.2.2.3 線の結合部の形状の設定 — 203
    8.2.3 矩形:rect要素 — 204
    8.2.4 円:circle要素 — 204
    8.2.5 楕円:ellipse要素 — 205
    8.2.6 直線:line要素 — 205
    8.2.7 テキスト(文字列):text要素 — 205
      8.2.7.1 テキストの描画位置の基準 — 206
      8.2.7.2 テキストの強調 — 206
      8.2.7.3 フォントスタイル — 206
      8.2.7.4 下線,上線,打消し線 — 206
      8.2.7.5 文字の回転 — 207
    8.2.8 パス:path要素 — 207
      8.2.8.1 直線の描画 — 207
      8.2.8.2 楕円弧 — 208
    8.2.9 画像データの配置 — 210
    8.2.10 transform属性 — 211
      8.2.10.1 変換の重ね合わせ — 212
      8.2.10.2 use要素による定義の展開 — 212
      8.2.10.3 図形要素のグループ化 — 213
9 プログラムライブラリ(1):jQuery — 214
  9.1 jQueryの導入 — 214
  9.2 jQueryオブジェクト — 214
    9.2.1 関数の起動 — 215
    9.2.2 HTML要素へのアクセス — 215
    9.2.3 イベントハンドリングの登録 — 216
    9.2.4 HTML要素の生成とDOMへの追加 — 216
    9.2.5 jQueryオブジェクトが保持するHTML要素 — 216
    9.2.6 jQueryで扱うHTML要素 — 217
    9.2.7 jQueryにおけるwindow,document — 217
  9.3 CSS属性へのアクセス — 217
  9.4 イベントハンドリングのためのメソッド — 218
  9.5 HTML要素の属性へのアクセス — 218
    9.5.1 属性値の動的な扱い — 219
      9.5.1.1 チェックボックスの扱い — 219
      9.5.1.2 ラジオボタンの扱い — 220
      9.5.1.3 データ属性の扱い — 221
    9.5.2 class属性の扱い — 221
  9.6 DOMの操作 — 223
    9.6.1 要素の追加 — 223
    9.6.2 要素の削除 — 225
    9.6.3 子要素,親要素,内部要素の取得 — 225
  9.7 要素の選択 — 227
  9.8 アニメーション効果 — 229
  9.9 Webアプリケーション実装に関すること — 230
10 プログラムライブラリ(2):MathJax — 232
11 プログラムライブラリ(3):React — 234
  11.1 基礎事項 — 234
    11.1.1 基本的なライブラリ — 234
    11.1.2 Reactアプリのレンダリング — 234
    11.1.3 React要素とコンポーネント — 235
      11.1.3.1 JSX — 235
      11.1.3.2 クラスコンポーネント,関数コンポーネント — 236
    11.1.4 コンポーネントに値を渡す方法:Props — 237
    11.1.5 コンポーネントのStateとライフサイクル — 238
      11.1.5.1 State — 238
      11.1.5.2 ライフサイクル — 239
      11.1.5.3 コンポーネントのスタイルの設定 — 239
      11.1.5.4 条件付きレンダリング — 239
      11.1.5.5 実装例に沿った解説 — 240
    11.1.6 コンポーネントのイベントハンドリング — 244
    11.1.7 複数コンポーネントの一括デプロイ:リストとキー — 245
  11.2 実用的な使用方法 — 247
    11.2.1 npmによる開発作業の概観 — 247
      11.2.1.1 必要なソフトウェアのインストール — 247
      11.2.1.2 ソースコードの用意 — 248
      11.2.1.3 ビルド作業のための設定ファイルの準備 — 248
      11.2.1.4 ビルド作業の実行 — 249
    11.2.2 ソースコードの分割開発 — 250
    11.2.3 ビルド作業時のリソース複製の設定: copy-webpack-plugin — 252
    11.2.4 コンポーネント実装のための簡便な方法 — 252
A Webサーバ関連 — 254
  A.1 Node.jsによるHTTPサーバ — 254
    A.1.1 ライブラリの読込み — 254
    A.1.2 サーバの作成と起動 — 254
    A.1.3 サーバの処理の実装 — 255
      A.1.3.1 URLの解析 — 255
      A.1.3.2 クエリ文字列の解析 — 256
      A.1.3.3 リクエストオブジェクトの解析 — 256
      A.1.3.4 クライアントへの応答のための処理 — 256
      A.1.3.5 POSTメソッドで受け取ったデータの受理 — 257
      A.1.3.6 エラーハンドリング(例外処理) — 258
    A.1.4 サーバの実装例 — 258
      A.1.4.1 単純な例 — 258
      A.1.4.2 POSTされたデータを受理する例 — 259
    A.1.5 ExpressライブラリによるHTTPサーバ — 260
      A.1.5.1 サーバの作成 — 260
      A.1.5.2 リクエストへの応答処理の実装 — 260
      A.1.5.3 サーバの起動 — 262
      A.1.5.4 サーバの実装例(1):リクエストのルーティング — 262
      A.1.5.5 サーバの実装例(2):リクエストの解析 — 263
      A.1.5.6 サーバの実装例(3):ルートパラメータの取得 — 264
  A.2 PythonによるHTTPサーバ — 266
    A.2.1 httpモジュールによる素朴なHTTPサーバ — 266
      A.2.1.1 HTTPServerクラス — 266
      A.2.1.2 BaseHTTPRequestHandlerクラス — 266
      A.2.1.3 サーバの実装例 — 267
    A.2.2 Flask — 270
      A.2.2.1 最も簡単なHTTPサーバの実装例 — 270
      A.2.2.2 リクエストの情報やPOSTされたデータの取得 — 271
  A.3 Apache HTTP Server — 275
    A.3.1 ソフトウェアの入手 — 275
    A.3.2 ディレクトリの構成 — 275
    A.3.3 インストール作業と設定 — 275
    A.3.4 CGI関連 — 277
      A.3.4.1 CGIを有効にする設定 — 277
      A.3.4.2 CGIの実装 — 277
      A.3.4.3 CGIのサンプル(1):単純な例 — 278
      A.3.4.4 CGIのサンプル(2):環境変数とPOSTされた内容の表示 — 280
    A.3.5 WSGI関連 — 282
      A.3.5.1 WSGIを有効にする設定 — 282
      A.3.5.2 WSGIスクリプトの実装 — 283
      A.3.5.3 WSGIのサンプル(1):単純な例 — 284
      A.3.5.4 WSGIのサンプル(2):環境変数とPOSTされた内容の表示 — 285
  A.4 ローカルの計算機環境でHTTPサーバを起動する簡易な方法 — 287
    A.4.1 Node.jsによる簡易な方法 — 287
    A.4.2 Pythonによる簡易な方法 — 287
  A.5 WebSocket — 288
    A.5.1 Node.jsによるWebSocket — 288
      A.5.1.1 サーバインスタンスの生成と設定 — 288
      A.5.1.2 クライアントとの通信に関する処理の実装 — 289
      A.5.1.3 エラーハンドリング — 289
      A.5.1.4 通信相手に対するメッセージの送信 — 290
      A.5.1.5 接続中のクライアントの一覧 — 290
      A.5.1.6 実装例 — 290
      A.5.1.7 URLのパスに基づくルーティング — 292
    A.5.2 PythonによるWebSocket — 296
      A.5.2.1 基本的な考え方 — 296
      A.5.2.2 サーバの作成と実行の流れ — 296
      A.5.2.3 ハンドラ関数 — 296
      A.5.2.4 サーバの実装例(1):非同期のイテレーションによる方法 — 297
      A.5.2.5 サーバの実装例(2):通常の反復による方法 — 299
B Webブラウザ関連 — 300
  B.1 スクリプトのキャッシュの抑止 — 300
C Node.js — 301
  C.1 REPLによる対話的な利用方法 — 301
    C.1.1 REPLの終了 — 301
    C.1.2 プログラムの読込み — 301
  C.2 標準入力からの同期入力 — 302

→ページ先頭に移動

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)