[Labyrinthe Noir]>[Top]>

JSすぐに使えるサンプル集

JavaScript を使った実用的なサンプルを提供します。
ソースと解説付きですので、JavaScriptの理解も進めながら、自分で応用できるようになります。

JavaScriptの基本

JavaScriptの基本的な記述のパターンを紹介します。

  1. <script>タグの書き方
  2. 基本的な動作方法
  3. タグの記述方法
  4. コメントアウトについて
  5. 変数について
  6. スクリプトが使えない場合
JavaScriptの小技

簡単で役立つ JavaScript の使い方を紹介します。

  1. 元のページに戻るリンク
  2. 飛ばないリンク
  3. ボタン型リンク
  4. 乱数を発生させる
  5. 同じ文字を繰り返す
  6. お気に入りに追加(IE専用)
  7. フォームの内容で動作を切り換える
  8. フォーム内テキストの自動選択
  9. ブラウザの判定
  10. 画面サイズを取得する
  11. 数字にカンマを付ける
  12. 小数点以下を揃える
  13. ゼロで桁数を揃える
  14. 数値から桁数を取得する
  15. キー入力を検知させる
  16. クリック時に特殊キーを検知させる
  17. URLからパス名やファイル名を取得する
メッセージを表示する

HTML と組み合わせてメッセージを扱う機能を紹介します。

  1. アラートの表示
  2. ウインドウステータスの表示
  3. フォームに表示
  4. メッセージをランダム表示(おみくじ)
  5. フォームを送信前に確認
  6. メールを出す
  7. 時間を計る(カウント表示)
  8. 時間を計る(時刻表示)
  9. 時間を正確に計る
  10. 現在の日時を表示する
  11. 「戻る」リンクの表示・非表示
  12. テキストファイルの読み込み(非同期通信)
  13. ファイルの更新日を取得(非同期通信)
  14. URLの検索文字列を取得
  15. Twitterに投稿する
画像を表示する

マウスの動きに合わせたり、自動的に変化するイメージを扱う機能を紹介します。

素材提供:うかの地下室、あおのり村、まなざしの工房

  1. マウスオーバーでイメージを切り換え
  2. 複数のイメージ切り換えボタン
  3. 複数の同じイメージを切り換え
  4. 複数のイメージを1ヶ所で切り換え
  5. 複数のイメージとメッセージを同時に切り換え
  6. 背景画像を変更
  7. 一枚ずつ画像を切り換える
  8. 一定時間で画像を切り換える
  9. 画像を角にポップアップ
  10. 画像を中央にポップアップ
  11. 背景画像を横スクロール
ウインドウを開く・閉じる

新しいウィンドウを開く方法と閉じる方法を紹介します。

  1. ウィンドウを開く
  2. ウィンドウを閉じる
  3. ウィンドウを自動生成
フレームを切り換える

フレームとドキュメントの切り換えを紹介します。

  1. フレームの仕組み
  2. 2つのフレームを同時に変更する
  3. フレーム自身の切り替え
  4. フレームから全体の切り換え
  5. フレームの内容をランダムに表示する
cookieを使ってみる

cookieを使った楽しい機能を紹介します。

  1. cookieとは?/cookie利用の注意点
  2. cookieの保存
  3. cookieの読込
  4. cookieを削除
  5. cookieでカウンター
  6. cookieで名前を表示
  7. cookieの読み書き(複数項目)
その他の便利な機能

その他、残して置きたい機能を紹介します。
そのまますぐに使えるものというよりも、記録として残して置きたいちょっと高度なものの保管場所にします。

  1. タブレット端末の判別
  2. タブレット端末でフリック入力

戻る