webサイト制作の勉強|2018年9月クラス用ブログ

webサイト制作の勉強に関する解説ブログです。

JavaScript

javascript 演習問題

以下の指示に従い、Javascriptを記述せよ。 ユーザーがプロンプト画面で年齢を入力したら、if文を使って以下のように条件分岐されるよう記述せよ。 0歳は「生まれたての赤ちゃんです」 19歳までは「未成年です」 20歳〜60歳は「成人です」 61歳以上は「シニ…

コピーライトの記述方法

フッター要素などにあるコピーライトの記述。サイトによって色々な書き方がありどう書いて良いか迷う所ですが、そもそもコピーライトの記述は絶対に必要なものでは無く、記述しようがしまいが、日本では著作物は法律でちゃんと守られます。それでも何となく…

setIntervalを使ってタイマー処理を行う

setInterval 一定時間ごとに特定の処理を繰り返す、関数です。 これを使いタイナー処理を行う事でリアルタイムに動く時計や一定時間で画像が変わるスライドショーなどを作る事が出来ます。 ミリ秒 javascriptでは秒数の指定を「ミリ秒」で指定します。 1000 …

関数の使い方

一連の処理をひとまとめにして、名前をつけたものを「関数」と呼びます。 手間のかかる処理を関数として定義しておけば、必要なときに必要なだけ何度も呼び出すことができます。関数は、function文を使って定義する。 定義した関数を実行するときは、関数名…

DOMでのオブジェクトの使い方

Windowオブジェクト Windowオブジェクトは、ブラウザーが持っている情報をそのまま持っています。ブラウザーの様々な情報を確認・取得する事が出来ます。 早速確認してみましょう。 <script> console.log(window); </script> documentオブジェクト documentオブジェクトとは、…

DOM (ドキュメント・オブジェクト・モデル)とは

Document Object Model (DOM) は、HTML および XML ドキュメントのための API です。これはドキュメントの構造的な表現を提供し、内容や表示形態の変更を可能にします。簡単に言い換えるとhtmlの各要素、たとえば「p」とか「img」といった要素に直接アクセス…

Math.randomの使い方

JavaScriptで乱数を取得したい場合には「random関数」を使います。 覚えるメソッド Math.random Math.random()は、0〜0.9999...(1未満)の間から、1つの数値をランダムで返すメソッドです。0は含みますが、1は含みません。 Math.round Math.round()は、小数点…

配列の使い方

配列とは複数の値を入れる事が出来る箱の事です。 今まで使っていた変数は1つにつき、1つの値しか入れる事が出来ず、新しい値を入れると上書きされてしまう、という特徴がありましたが、配列を使う事で同時に複数の値を収納出来るようになります。 配列の使…

Dateオブジェクトで時間の取得

「 new Date()」を使う事で、現在の時間を取得することが出来ます。 <script> var date = new Date(); document.write(date); </script>実際に表示してみると「 new Date()」には日時についての様々なデータが収納されているのが解ります。 このままでは使いづらいので「 new …

for文の多重ループ

for文でのインクリメント/デクリメント演算子 上記のインクリメント演算子を使って 2から100まで2づつ増えていくfor文を作成しましょう。 一つのfor文(ループ)の中に、さらにfor文を入れることができます。 もちろん入れ子の深さを二重、三重、...と深くし…

イベントハンドラによる画像置換

イベントとは? イベントとは,ブラウザ上で発生した出来事全般のことを表します。例えばブラウザに表示された画像をマウスをクリックしたり、テキストボックスに文字を入力するといったように,閲覧者が何か操作したときにイベントが発生します。またHTMLが…

for文の使い方

for文もwhile文と同じ繰り返し(ループ)処理ですが、記述方法が変わるので、違いをしっかりと覚えましょう。 for ( 変数iの初期値 ; 繰り返し条件 ; 変数の変更 ) { 処理の結果 } 記述例 <script> for (var i = 1 ; i <= 100 ; i++) { console.log( i ); } /* for </script>…

色々なメソッドの使い方

基本的なメソッドの使い方を覚える window.document(ブラウザーに文字を表示させる) JavaScriptで文字列を表示するには、「window.document.write( )」を使います。 表示したい文字列をシングルコートではさみます。「window.」は省略できます。 .document…

if文を使った条件分岐

if文を使うことで、プログラムの結果を分岐する事が出来ます。例えば 値が〇〇以上であれば、Aルート値が〇〇以下であれば、Bルートというように、ある条件をもとにルートが分岐する事を条件分岐といいます。 if文の書き方 if (条件) { 条件が真であれば実行…

JavaScriptの基礎

JavaScriptとは、米Netscape Communicationsによって開発されたスクリプト言語です。JavaScriptは主にWebブラウザ上で動作します。クリックすると画像が変わったり、要素が消えたり、現れたりというHTMLやCSSでは出来ない、いわゆるサイトの動的な部分を担当…

変数の使い方

JavaScriptでまず覚える事は変数の使い方です。変数とは値を入れておくことができる箱のようなものです。 処理結果などの値を変数に格納したり、それをまた別の処理へ引き渡したりすることができます。 変数宣言 変数を使用する上で、まず行うのが変数宣言で…

プログラムとは

プログラムとは?いよいよJavaScriptの授業が始まります。人によっては今回のJavaScriptがプログラムに触れる初めての機会になる場合もあります。 プログラムという物を触った事が無い人はまず、「プログラム」という物がどういう物なのか、という事を理解し…