各種サンプルとソース

knockout.js：練習

1. selectで初期値あり
2. selectで選択したものを表示
3. selectで初期値あり：連想配列ちっく
4. selectで選択したものを表示：連想配列ちっく
5. selectで選択したものを表示：連想配列ちっく2
6. clickでCSS変更
7. foreachで配列の表示
8. clickした行のデータの一部表示
9. clickした行にcss追加
10. clickした行にcss追加：他はcss削除
11. clickした行にcss追加：他はcss削除２
12. clickした行にcss追加して、別ページ開く
13. データが無ければ別の何かを表示
14. ボタンクリックでinputタグに切替（enableバインディング）
15. ifで表示の切替
16. ifとtemplateの組み合わせ
17. ボタンクリックでinputタグに切替(ifバインディング)
18. ボタンクリックでinputタグに切替(ifとtemplateバインディング)
19. Jsonデータの読込み
20. 空データの追加
21. クリックした行をアラートで表示
22. クリックしたカラムでソート
23. クリックしたカラムでソート２
24. styleバインディングの記述例
25. jqGridバインディングの余分な箇所を削除したシンプルなヤツ
26. jqGridバインディングで一部styleバインディングを指定
27. ifバインディングを使わずに真・偽で条件分岐：三項演算子
28. ifバインディングを使わずに真・偽で条件分岐：三項演算子２
29. ボタンクリックでinputタグに切替(三項演算子とtemplateバインディング)

knockout.js：本家のチュートリアル

intro

1. Jqueryを使わずにデータを表示
2. Jqueryを使ってデータを表示
3. inputのvalueに値をセットして表示
4. inputのvalueの値を変更したら即反映
5. ボタンクリックで小文字を大文字に変換

WorkingLists

1. データ群（配列？）を表示
2. 表示したデータにレコード追加
3. 選択した値に合わせて表示データを変更
4. 表示したデータからをレコード削除
5. 表示しているレコード数の表示と追加レコード数の制御

SPA（webMail）

1. データ群（配列？）を表示
2. ファイルからデータ読込：txtファイルを「$.get」で取得
3. ファイルからデータ読込：txtファイルを「$.getJSON」で取得
4. ファイルからデータ読込：各txtファイルを「$.getJSON」
5. クリックしたデータをレイアウトを変えて表示
6. クリックしたデータをレイアウトを変えて表示:summy.jsを使う場合

knockout.js：バインディング（Using built-in bindings）

Controlling text and appearance

1. The visible binding
   1. Example 1: 表示と非表示
   2. Example 2: 値があれば表示、なければ非表示
2. The text binding
3. The html binding
4. The css binding
   1. Example 1: 条件によってCSS指定
   2. Example 3: 条件によって好きなCSS名を指定
5. The style binding
   1. 条件によって好きなstyleを指定
   2. font-weightやtext-decorationなど
6. The attr binding

Control flow

1. The foreach binding
2. The if binding
   1. Example 1: ifでメッセージの表示・非表示
   2. Example 2: 値が存在するときだけ表示
   3. Example 3: コメントを使ってのif
3. The ifnot binding
4. The with binding

Working with form fields

1. The click binding
   1. Example 1: ボタンクリックでカウント
   2. Example 2: ボタンクリックで値を消していく
   3. Example 3: 「shift + ボタンクリック」と「ボタンクリック」で別処理
2. The event binding
3. The submit binding
4. The enable binding
   1. Example 1: inputのenable（有効化）
   2. Example 2: 特定の値じゃなければenable（有効化）
5. The disable binding
6. The value binding
   1. Example 1: valueバインディングを使って表示
   2. Example 2: input内を修正したら即表示
   3. Example 3: observableを使わない場合
7. The hasfocus binding
8. The checked binding
   1. Example 1: checked=checkedにする
   2. Example 2: checked=checkedで表示・非表示
   3. Example 3: checked=checkedで表示・非表示とradioボタン
9. The options binding
   1. Example 1: Drop-down list
   2. Example 2: Multi-select list
   3. Example 3: Drop-down list representing arbitrary JavaScript objects, not just strings
   4. Example 4: Drop-down list representing arbitrary JavaScript objects, with displayed text computed as a function of the represented item
10. The selectedOptions binding
11. The uniqueName binding

Rendering templates

1. The template binding
   1. Example 1: テンプレートを使用
   2. Example 2: テンプレートをforeachで使用

Further techniques

1. Creating custom bindings
2. Loading and saving JSON data
3. Extending observables
4. The throttle extender
5. Unobtrusive event handling
6. Using fn to add custom functions

Plugins

1. The mapping plugin

jquery：練習

1. parentとparents
2. クリックされた行を色変更
3. クリックされた行をinputタグにする
4. tableタグ内のtableタグの左右上下の罫線
5. テーブル内の列の表示・非表示

Javascript：練習

1. アラートにメッセージを表示
2. アラートにメッセージを表示して、ボタンによって処理を変える
3. アラートに改行されたメッセージを表示
4. JSの配列のソート

jqGrid：練習

1. 余分なモノをなくした単純なタイプ

html/css：サンプル・練習

1. Aタグを画像不使用のCSSだけでボタン