10月の授業日記

JavaScriptとは

html 文章の構造を定義
CSS 文書の見栄えを修飾
JavaScript ユーザーのアクションに応じてブラウザを制御

 

基本文系

  1. オブジェクト.メゾット
  2. オブジェクト.プロパティ=値; 

オブジェクト

ブラウザのパーツのJSでの呼称

  • window.document
ドットでつないでいく

メゾット

オブジェクトできる機能を実行する

  • window.alert();
  • document.write();

プロパティ

オブジェクトの持つ設定値を変える

  • document.dgCoior=値;

イベントハンドラ

  • ユーザーのアクション(ブラウザに対する働きかけ)に応じて命令を実行する
  • タグの属性

<タグ イベントハンドラ=”命令文”>

  • 簡単な命令ならこの中に記述できる
  • htmlのイベントハンドラをきっかけにJSがhtmlやCSSを制御できる

きょうのひとこと

新しいことについていくのに必死でした 。

10/10 関数

JavaScriptの基本文法

オブジェクトメゾット(値)

オブジェクト=値

プロパティを表示させる

文字列ではない数値や値を示す時にはクオートを入れない

ウィンドーを開く

ウィンドーをサイズ指定して開く

window.open('URL','ウィンドウ名','width=xx,height');

  • オプションサイズの間はカンマで区切る
  • サイズ指定は同一オプション=一つのクオートな内をカンマで区切る

関数

複数の命令をひとまとめにしてにして名前をつけたセット

関数の定義法

fanction 関数名 (引数){命令文}

引数は値などを入れる時の入れもの。使わない場合でも空で()をつけておく

関数の呼び出し

<タグ イベントハンドラ=”関数名(引数)”>

複数の命令をシンプルに実行できる

きょうのひとこと

新しいことが多く、覚えるのが大変でした。

10/17 DWによるJaScript

 

関数を使用してウィンドーを開く

7月を何度も聞くような場合は簡単になる

URL毎に関数を作らなければならない

関数に変数を利用してウィンドーを開く

変数を利用すると一つの関数で様々なバリエーションが作れる

funktion関数名(変数名){変数,"ウィンドー","width=X","height=y"}

引数を変数(クオートに入れない)にすればイベントハンドラの引数の値を代入できる

<タグ イベントハンドラ="関数名(変数に代入する値)">

外部JSファイル

スクリプトを記述した拡張子.js のファイルにリンクすれば外部ファイルに記述したスクリプトを実行できる

<script Src="jsファイルへのパス" ></script>( 終了タグ要)

外部ファイルに記述されている関数等をイベントハンドラで呼び出す使用方法が多い

ライブラリとフレームワーク

  • 外部jsファイルにパーツや画像などのファイルを読み込んだりしたものをライブラリーやフレームワークと呼ぶ
  • JSを記述できなくても様々な機能が利用でき、こうした方法が主流に

代表的なもの

  • jQuery
  • Spry>adobe純正でDWのインターフェイスに組み込まれていた

DWによるjavaScript

DWにはスプリクトを使用しなくてもJSによるページが作れるプリセットが搭載されている

  • ビヘイビアー
  • ロールオーバーイメージ
  • jQuery UI

ビヘイビアー

DWでのJSのプリセット

10/24 ライブラリ/フレームワーク

ビヘイビアの復習

画像を入れ替える

スリープイメージ

ビヘイビアによる切り替え

元のイメージを挿入しそれに設定する

ロールオーバーイメージ

 

挿入からリンク付きで挿入できる

CSS

文字下にもできる

  • ブロックレベル化し背景画像に設定すれば同じベースで異なるテキストで使いまわせる
  • a:hoverで背景画像をチェンジ

JSフレームワーク

外部スクリプトの大規模化したものがフレームワーク

jQuery

  • もっとも普及しているフレームカークの一つ

jQuery UI

  • adobe独特のフレームワークSpryをjQuery用に手直ししたもの
  • 挿入し保存すると必要なファイルがサイト内へコピー・リンクされる

DatePicker

日付けをカレンダーから選べるjQueryのインターフェイス

フレームワークの注意点

  • ファイルを移動しない
  • コードを改変・削除しない

きょうのひとこと

最後の時間になって突然難しくなった気がします。