10月の授業日記

JavaScriptとは

基本書式

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

オブジェクト

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

• window.document

ドットでつないでいく

メソッド

オブジェクトが出来る機能を実行する

1. window.alert();
2. document.write();

イベントハンドラ

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

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

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

今日のひとこと

「JavaScript」響がカッコイイですね。

JavaScript

オブジェクトメソッド　(値)

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

プロパティを表示させる

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

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

ウィンドーを開く

• 私の秘密

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

• 私の秘密をサイズ指定して開いた

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

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

関数

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

関数の定義法

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

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

関数の呼び出し

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

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

• 関数クイズ

　今日の一言

だめだ・・・難しすぎる・・・・。全然ついてけないです😭

無理。

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

• 9月
• ７月を何度も開く様な場合簡単になる
• URL毎に関数を作らなければいけない

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

• 7月
• 6月

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

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

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

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

外部jsファイル

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

＜sclipt src="jsファイルへのパス"＞＜/sclipt＞(終了タグ要)

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

• 占い
• バナー表示

DWによるJavaScript

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

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

ビヘイビア

DWでのJSのプリセット

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

ビヘイビア復習

• アラート

画像を入れ替える

スワップイメージ

ビヘイビアによる切替

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

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

css

激辛胡麻味噌担々麺

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

JSコマンドワーク

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

jQuery

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

Datepicker

注意点

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

今日のひとこと

今回はスムーズにコーディング出来ました🤘

少し余裕があったので遊びました。