10月の授業日記

JavaScriptとは

基本書式

1. オブジェクト.プロパティ＝値;
2. オブジェクト.メソッド（）

オブジェクト

ブラウザのパーツのJsでの略称

• window.document

ドットでつないでいく

メソッド

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

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

イベントハンドラ

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

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

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

今日の一言

難しいのでうまくできているかわからない

JavaScriptの基本文系

オブジェクト.メソッド（値）;

オプジェクト.プロパティ＝値;

プロパティを表示させる

• document.write(オブジェクト.プロパティ)

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

window.open()

• わたしのひみつ

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

window.open('url','window名','width=XX,height=xx')

関数

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

関数の定義

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

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

関数の呼び出し

＜タグ イベントハンドラ＝"関数名(引数)"＞

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

• 関数クイズ

関数を利用してウインドーを開く

• 9月

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

• 7月
• 6月

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

function 関数名(変数名){変数,'ウインド名','width=X, height=y'}

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

＜タグ イベントハンドラ＝"関数名(変数に代入する値)"＞

今日の一言

ダミーリンクが繋がらない

10／17　DWによる JavaScript

外部jsファイル

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

<script src="jsファイルへのパス"></script>（終了タグ要）

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

• うらない
• バナー表示

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

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

代表的なもの

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

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

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

ビヘイビア

DWでのjsのプリセット

• ウィンドーを開く
• プロパティの変更
• テキスト変更
• 今日の一言

10/24　JSフレームワーク

ビヘイビアのおさらい

• アラート

画像を入れ替える

スワップイメージ

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

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

CSS

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

JSフレームワーク

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

jQuery

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

jQuery UI

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

Datepicker

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

フレームワークの注意点

• 多くの外部ファイルを使用するのでファイル管理・リンク管理が重要
• コードが様々な場所に記述されるので移動・削除などしない

今日の一言

よくわからない