概要

Webデザイナー養成講座シリーズは，プロのデザイナーとして仕事をする上で，必須のスキルを身につけるためのシリーズです。本書では，JavaScriptをこれから学習する初級者のために，JavaScriptについての基本的な知識，記述方法，具体的な利用例などを解説します。実際のWebサイト制作に使えるコードを多数紹介しているので，仕事の現場ですぐに役立つ内容となっています。

こんな方におすすめ

• Webページ制作でJavaScriptを利用したい人

目次

CHAPTER 1　JavaScriptの基本

• 01　JavaScriptとは
• 02　HTML5とは
• 03　プログラミングに必要なもの
• 04　Google Chromeを用意する
• 05　JavaScriptをHTML中に書く
• 06　基本的なJavaScriptの記述ルール
• 07　JavaScriptを外部JavaScriptとして書く
• 08　jQueryを使う
• 09　jQueryの基本構文1　セレクタ編
• 10　jQueryの基本構文2　イベント編
• 11　デバッグの方法

CHAPTER 2　Webページの操作　～変数の利用～

• 01　入力欄の内容をページ内に表示する
• 02　本文を抜き出して入力欄に表示する
• 03　リストの値を取得する
• 04　リストの選択番号を指定する
• 05　チェックボックスとラジオボタンを操作する
• 06　Webページの表示サイズを取得する

CHAPTER 3　文字の加工　～文字列処理～

• 01　入力欄の長さをチェックする
• 02　HTMLタグを除去する
• 03　文字列のエンコード/デコードを行う
• 04　Webページを遷移する

CHAPTER 4　値による表示の変更　～条件分岐～

• 01　チェックボックスのON/OFFでメッセージを変更する
• 02　金額の大小でメッセージを変更する
• 03　商品の合計重量と個数によってメッセージを変更する
• 04　送信ボタンを押した際の入力チェックを行う
• 05　時間帯によって表示画像を変える
• 06　訪問回数によって，メッセージを変更する

CHAPTER 5　複雑化した処理の整理　～関数～

• 01　マークダウンエディタを作成する
• 02　URLとタイトルからリンクを作成する
• 03　CSVからリンク一覧を作成する
• 04　マウスオーバーで説明を表示する

CHAPTER 6　大量のデータの処理　～配列とループ処理～

• 01　商品紹介を順番に表示する
• 02　スペース区切りのキーワードからリストを作成する
• 03　時間遷移する簡易アニメを作る
• 04　ローカルのテキストファイルを読み込み，加工する
• 05　ドラッグ&ドロップした画像をWebページに追加する
• 06　商品名を読みでソートする

CHAPTER 7　JavaScriptのデータ構造　～オブジェクト～

• 01　オブジェクトとプロパティを知る
• 02　windowオブジェクトを知る
• 03　new演算子でオブジェクトを作る

CHAPTER 8　キャンバス　～Canvas 1～

• 01　Canvasを利用してロゴを作る
• 02　Canvasを利用したダミー画像を生成する
• 03　Canvasを利用した角丸フキダシを作る

CHAPTER 9　画像，音声，動画の利用　～Canvas 2，Audio，Video～

• 01　Canvasへの画像の描画を行う
• 02　画像を2値化する
• 03　音声の読み込みと再生を行う
• 04　動画の読み込みと再生を行う
• 05　ライブラリの紹介

サポート

ダウンロード

本書で使用するサンプルファイルはダウンロードできます。圧縮ファイルをダウンロードしていただき，適宜解凍してご利用ください。

ダウンロード

サンプルファイル