10月の授業日記

JavaScriptとは

基本文系

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

オブジェクト

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

• window.document

ドットでつないでいく

メソッド

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

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

プロパティ

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

• document.bgColor=値;

イベントハンドラ

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

＜タグ イベントハンドラ＝”命令文”＞

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

今日のひとこと

新しい分野に入ったので、覚えるこぼとが多いですが、しっかりと覚えていこうと思います。

Jabvascriptの基本文系

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

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

プロパティを表示させる

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

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

ウインドーを開く

• わたしのひみつ

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

• わたしのひみつをサイズ指定して開いた

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

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

関数

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

関数の定義方

function 関数名（引数）（命令）

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

関数の呼び出し

＜タグ　イベントパンドラ＝”関数名（引数）”＞

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

• 関数クイズ

今日のひとこと

javascriputはコーディングがとても多いので覚えることが多いですが、遅れを取らないよう頑張ります。

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

• 9月
  • 7月を何度も開くような場合簡単になる
  • URL等に関数を作らなければいけない

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

• 7月
• 6月

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

function 関数名（変数名）{変数,'ウィンドウ名','サイズ'}

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

＜タグ イベントハンドラ＝"{変数に代入する値}＞

外部jsファイル

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

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

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

• 占い
• バナー表示

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

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

代表的なもの

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

DWによるJavaScript

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

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

ビヘイビア

DWでのJSプリセット

• ウィンドウを開く
• プロパティの変更
• テキストの変更
• 今日のひとこと

ビヘイビア復習

• アラート

画像入れ替え

スワップイメージ

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

ロールオーバーイメージ

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

CSS

夜兎

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

JSフレーム

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

jQuery

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

Datepicker

注意点

• ファイルを動かさない
• コードを改変しない

今日のひとこと

JavaScriptの点でリンクが働かないなどのミスが見られるので、次までに修正を試みたいと思います