学科 JavaScript基礎②

-本日のアジェンダ-

1限目
学科 JavaScript基礎②
動的処理について

2限目
学科 JavaScript基礎②
動的処理の組み込み方法

3限目
学科 JavaScript基礎②
課題制作

4限目
学科 JavaScript基礎②
課題制作

5限目
学科 JavaScript基礎②
課題制作

本日のテーマ

Webページに動的処理を組み込みましょう。

動的処理とは

Webページには、静的ページと動的ページがあります。静的ページは、いつ、どこでアクセスしても同じ内容しか表示されないページです。一方、動的ページは、アクセスする時の環境や操作内容によって表示される内容が変化するページです。動的ページを作成するためには、サーバー側で処理する方式と端末側で処理する方式があります。

端末側で処理する方式の動的ページの例は、以下の通りです。(一部の例は、HTMLとCSSだけで実現できるものもあります)

  • 複数の画像をスライダー方式で切り替える
  • 画像をクリックしてポップアップ(拡大)させる
  • Webブラウザのようにページ内にタブを設置する
  • ページにアニメーションをつける
  • 図表などのソート(並び替え)を行う
  • 投稿フォームの項目を入力内容によって変更する
  • リアルタイムのチャートグラフを作成する
  • カレンダーを設置する
  • 電卓機能を設置する など

参考サイト

本日の課題

WordPressサイトに、本日学んだ内容を投稿ページにまとめてください。

第5回成績考査について

8月30日(火)の5限目までに、Webページを提出してください。
※WEBページはFFFTPでHTMLサーバーにアップしてください。
※サイト内容は自由です。是非、就職活動に活かせる作品を作成してみてください。

学科 JavaScript基礎①

-本日のアジェンダ-

1限目
学科 JavaScript基礎①
JavaScriptについて

2限目
学科 JavaScript基礎①
JavaScript 使い方について

3限目
学科 JavaScript基礎①
課題制作

4限目
学科 JavaScript基礎①
課題制作

5限目
学科 JavaScript基礎①
課題制作

本日のテーマ

JavaScriptの活用法についてです。

JavaScript とは

JavaScriptはスクリプト言語のひとつでありNetscape Communications社によって開発されたプログラミング言語ですが、標準化され現在ではほとんどのブラウザの標準スクリプト言語として使用されています。JavaScriptを使用することでWebページに動きを与えたり算術などの処理を行うことが可能になります。JavaScriptはクライアント(ブラウザ)のスクリプト言語として発展して来ましたが近年ではサーバーサイドでも稼働するものもあります。JavaScriptの言語仕様はECMAScriptとして標準化されています。

参考サイト

jQuery とは?

jQueryは、ウェブブラウザ用のJavaScriptコードをより容易に記述できるようにするために設計されたJavaScriptライブラリです。jQueryは、JavaScriptライブラリのデファクトスタンダードであると言われています。
jQueryは、以下の特徴を持ちます。

  • ブラウザの違いを意識せずに処理を記述できます。
  • HTML文書(DOM:Document Object Model)に簡単にアクセスできます。
  • Ajax処理(サーバーとの非同期通信)が簡単に記述できます。

参考サイト

本日の課題

WordPressサイトに、本日学んだ内容を投稿ページにまとめてください。

第5回成績考査について

8月30日(火)の5限目までに、Webページを提出してください。
※WEBページはFFFTPでHTMLサーバーにアップしてください。
※サイト内容は自由です。是非、就職活動に活かせる作品を作成してみてください。