注意
この記事は、僕Marnyがhtml、javascriptを勉強する際のメモ代わりです。初心者なりにいろんなことをメモしていきます
HTML編
タイトル設定
<!DOCTYPE html>
<title>
</title>
テキスト記入
<!DOCTYPE html>
<body>
</body>
ボタン追加
<button>
</button>
リンク添付
<body>
<a href="URL"></a>
</body>
—————————————————————————————-
JavaScript編
htmlにjsを組み込む
<script>
ここにいろいろ書く
</script>
ダイアログボックスで表示
alert("表示させるメッセージ");
URLを指定したページ遷移
<head>
<script>
function 関数名(){
document.location = "URL"
}
</script>
</head>
<body>
<button onclick="functionで定義した関数">適当な文字</button>
</body>
関数の定義
<head>
<script>
function 関数名(){
関数の処理
}
</script>
</head>
クリック判定追加
<body>
<何かしらの行の指定 onclick="jsで指定した関数">判定のつける文字</何かしらの行指定>
</body>
変数の定義、呼び出し
<body>
<script>
var = 変数名; //定義
console.log(変数名); //呼び出し
</script>
</body>
console.logは開発者ツールのコンソール画面にて、デバックに使うらしい
変数の定義2
let 変数名 = "変数の中身";
console.log(変数名);//これで出力される
//letの値を更新
変数名 = 更新したい内容;
ex) let num = 2; //このときのnumは2
num += 3; //このときのnumは3
letとvarの違い
・letはブロックレベルで定義される
・varは関数でのスコープ（ブロックを抜けても保存される）
定数の定義
const 変数名 = "代入する値";
ex) const lang = 日本語;
console.log (lang+"が話せる");
or
console.log(`${lang}が話せる`); //${}をテンプレートリテラルという
出力↓
日本語が話せる
定数と変数
・定数とは、文字どうり指定してしまえばほかの値に更新することができない。対して、変数は値の変更が可能である。
・定数を使うメリットとしては、変数とは違い値が変更されないので、何かの拍子で値が変更されてエラー等が出ないことがあげられる。
条件分岐
const = 15;
if (条件式){ //const > 10 とかだとif文内が処理される
なんかしらの処理
}
[条件式]
"> <" より以上、以下
" >= <=" その値も含めた以上以下
"!=== ===" ≠,=
Switch文
switch(条件の値){
case"条件式":
処理;
break;
default: // case文のどれでもない場合の処理
処理
break;
}
if文をきれいに書いた感じ