読者です 読者をやめる 読者になる 読者になる

ハロートレーニングWebデザインの勉強 Webデザイン フェリカテクニカルアカデミーWebサイト制作科

JavaScript - まとめ演習

演習課題 「javascript」フォルダーを作り、「index.html」に【01】〜【07】へのリンクを作りなさい 【01】〜【07】もフォルダーをつくり、その中に「index.html」を作り解答を記述しなさい 【01】 50〜100までの合計をブラウザに表示させなさい 【02】 1〜…

連想配列の利用

連想配列 配列の場合「0」から始まる添字で要素を指定しましたが意味的な関連性はありません その添字の代わりに、「キー」と呼ばれる文字列で要素を指定します 連想配列は、「Objectオブジェクト」というオブジェクトとして扱います 連想配列の生成 new演…

random関数

乱数の発生 「random()」は、「0以上1未満の乱数を生成する」メソッド 「floor()」は、「小数点以下を切り捨てる」メソッド ランダムな「整数」を生成する rnd = Math.floor(Math.random() * MAX + 1); <html lang="ja"> <head> <meta charset="UTF-8"> <title>乱数の発生</title> </head> <body> <h1>乱数の発生</h1> <script> MAX = 10; var num; fo</body></html>…

数学関数

Numberオブジェクト 数値全般を表すNumberオブジェクト 変数に数値を代入したり、数値を扱った計算をおこなうとしたときに自動的に作成される Numberオブジェクト型の変数 n を自動生成して値に 15 を代入する n = 15; new演算子を使用して、明示的に作成す…

関数のまとめ - 演習

関数まとめ クリックなどのイベント処理は、functionに書く functionは、呼び出さなければ動作しない 似たような処理は引数を使って、同じfunctionにまとめる 引数はなくてもよい、必要ならいくつでも指定できる ブラウザの構造 通信ソフトウエア レンダリン…

関数の応用

関数の代入と匿名関数 関数は、数値や文字列のように変数に入れて扱うことができます この方法を使うと、条件に応じて異なる関数を変数に設定したり、関数を引数として別の関数に渡したりと、より柔軟に関数を利用できます 変数名 = 定義済みの関数名; 《関…

組み込み関数

組み込み関数とは JavaScriptがすでに備えている関数 《組み込み関数一覧》 関数名 説明 parseInt 文字列型の数字列を数値型(整数)に変換する parseFloat 文字列型の数字列を数値型(実数)に変換する isNaN 指定された値がNaNであるかどうか調べる encode…

関数

関数とは 一連の処理をひとまとめにして、名前をつけたものを「関数」と呼びます 手間のかかる処理を関数として定義しておけば、必要なときに何度も呼び出すことができます 関数は処理の材料となる「引数」を受け取ります 処理が終了すると「戻り値」と呼ば…

Dateオブジェクト - 状況に応じた処理

Dateオブジェクト JavaScriptに用意されている組み込みオブジェクト Dateコンストラクタを引数なしで実行すると、現在の日付時刻を管理する「Dateオブジェクト」が生成される JavaScript の日時は、UTC の 1970 年 1 月 1 日 0 時からのミリ秒としてで計られ…

組み込みオブジェクト

組み込みオブジェクトとは 関数と同じくオブジェクトの場合も、JavaScriptがあらかじめ用意しているオブジェクトがあります これを「組み込みオブジェクト」と呼びます 《主な組み込みオブジェクト一覧》 オブジェクト名 説明 Object すべてのオブジェクトの…

配列はArrayオブジェクト

配列はArrayオブジェクト 配列をArrayオブジェクトというオブジェクトとして扱います 配列(ビルトインオブジェクト)を生成するには、new演算子とArrayコンストラクタを使い新しいオブジェクトを生成します Arrayコンストラクタの引数には、要素数を渡しま…

配列とは

配列とは 配列とは、同じ用途で用いる複数の変数を1つにまとめたもの 配列は要素の集合体 配列は変数の集まりによって構成されます 個々の変数のことを「要素」と呼びます 各要素を識別するために「インデックス」と呼ばれる番号(0から始まる整数値)が割…

新-画像置換

画像の準備 Photoshopで、「幅600px 高さ400px」の新規ファイルを作成する 画像をレイヤーとして重ねる レイヤー名を連番にしておく レイヤーをファイルへ書き出し 「ファイル」メニュー →「スクリプト」→「レイヤーをファイルへ書き出し」 保存してから行わ…

DOM まとめ

ダイナミックHTML JavaScript のようなクライアント側のプログラムを使って HTML の内容を動的に変化させる概念を、「ダイナミックHTML」 といいます 「JavaScript」 から HTML の内容を制御する事ができるので、HTML が動的に変化するインタラクティブなコ…

画像置換

JavaScriptで画像置換 JavaScript Reference:onmouseover CSSは必要なし! onmouse属性を使った簡単なロールオーバーの作り方 要素に直接記述(インライン) onmouseover = " this.src = ' img/◎◎.jpg ' " onmouseout = " this.src = ' img/◎◎.jpg ' " サム…

条件が成立している間処理を繰り返す - while文

while文 反復処理(繰り返し)を行います 同じ事を繰り返すことを「ループ」と呼びます for文との違いは、ループのカウンタとして使用する制御変数の扱い for文の場合は、制御変数の初期化や増減の式をforの直後の「( )」内に記述 while文の「( )」では、条…

指定した回数だけ処理を繰り返す - for文

for文 指定した回数だけ処理を繰り返す 変数「i」の初期値(「i」は、indexの意) 処理を1回実行するたびに、変数「i」の値をどのように変更するか for ( 変数の初期値; 繰り返し条件; 変数の変更 ) { 実行される処理 } 変数の値を1ずつ増やす演算子 「+…

条件分岐 - if文

スクリプトには3通りの進み方がある(実行する流れ) 順次 分岐 反復 if文 条件によって、ある処理を実行するかしないか選択して、処理の流れを分岐させたいときに使う構文 条件がtrueのときは処理を実行する 条件が成り立たないとき(falseのとき)は、処…

ブラウザに文字を表示(出力)

オブジェクトの階層構造 Webブラウザ上の主なオブジェクトには、windowオブジェクトを頂点とする階層構造があります ブラウザに文字を表示(出力) 「Hello World!!」とブラウザに表示させる <html lang="ja"> <head> <meta charset="UTF-8"> <title>Hello!</title> </head> <body> <script> window.document.write( 'Hellow World!!' ); </script> <noscript> Ja</noscript></body></html>…

出力(処理の結果を表示)

3種類の出力 console.log() で出力(検証ツールへ出力) alert() で出力(ダイアログボックスへ出力:手軽に使えますがWebサイトで使用する機会はあまりありません) document.write() で出力(ブラウザーの内容を書き換えて出力) コンソールに出力 「コン…

演算子

式(expression) 演算子(operator):演算するもの オペランド(operand):演算の対象 を組み合わせてつくられています。 式の評価 式の計算が、式の評価にあたります 評価された結果を「式の値」と呼びます 演算子 簡単な計算をしたり長い文字列をつなぎ…

変数

変数(variable)とは 変化するもの(値が変化する器) 値を直接書かずに抽象化して扱う 変数はプログラム中のメモリ領域に付けた名前です さまざまな値を一時的に記憶しておくために使われます 言葉(文字列)や数字(数値)を一時的に保存する「箱」 繰り…

JavaScriptをHTMLに書く

書き方のルール 基本的に「半角英数字と記号のみ」を使う 文字列を扱う場合は「シングルクォート」か「ダブルクォート」で囲む 大文字と小文字は区別される 命令文の末尾には「セミコロン」をつける 複数行にわたるまとまりの命令文は「{}波括弧」で囲む(囲…

JavaScriptとは

プログラミング言語とは コンピューターへのお願いする言語 複雑なタスクを処理する「プログラム(アルゴリズム)」を考えるのは人間 JavaScriptとは クライアントサイドで動作するプログラミング言語 Javaとは別もの HTML&CSSを書き換えることができる イン…