gblog

gememo

たった1日で基本が身に付く! JavaScript超入門 その5

イベントハンドラー:イベントに対して処理を定義、1:1

イベントリスナー:イベントと処理を紐づける、1:n

 

《定義手段》

イベントハンドラー:要素のタグ内で定義。又は要素オブジェクトのプロパティで定義。

イベントリスナー:要素オブジェクトのaddEventListenerメソッドで定義。

 

《クッキーとWebStorage》

クッキー:保存時に指定した期限

sessionStrage:ウィンドウやタブを閉じるまで

localStrage:永続的に利用可能

 

たった1日で基本が身に付く! JavaScript超入門 その4

DOM(Document Object Model:ドム)とは

DOMの仕様は以下の2点に集約される

  1. 文書をオブジェクトとして扱う
  2. 文書へのアクセスや操作の方法を定義

◆主なノード

  • 文書ノード:予約後[document]で扱う
  • 要素ノード
  • テキストノード
  • 属性ノード
  • 親ノード
  • 子ノード
  • 兄弟ノード

◆主な要素取得方法

document.getElementById

document.getElementsByTagName

document.getElementsByClassName 

 

CSSと組み合わせてClassでやるのが一般的なのかどうかも調べる。

たった1日で基本が身に付く! JavaScript超入門 その3

これが以前、間違えちゃうかと思ったけどあってるって言われた演算子か。

演算子 概要
== 等しければtrue
=== 型を変えずに等しければtrue
!= 等しくなければtrue
!== 型を変えずに等しくなければtrue

型を変えずに って衝撃やわ。

比較する際は、型を含めて比較する===演算子または!==演算子を使うようにしましょう。って当たり前田のクラや。

たった1日で基本が身に付く! JavaScript超入門 その2

var つけないとグローバル変数になる

◆主なデータ型

  • 文字列型
  • 数値型
  • 真偽型
  • 配列型
  • オブジェクト型:連想配列のことだって

◆主なオブジェクト

  • 組み込みオブジェクト:JavaScriptであらかじめ定義されている
  • ブラウザオブジェクト:ブラウザで取り扱える
  • DOMオブジェクト:HTMLの要素のアクセスができる

◆主な組み込みオブジェクト

  • String
  • Number
  • Boolean
  • Array
  • Object
  • Math
  • Date
  • JSON

で、ここからがポイントで

Sgtring~Objectまでがデータ型と対応していて、文字列型で変数宣言するとStringオブジェクトが持つプロパティやメソッドが利用できると。なんじゃそりゃ。適当な 気の利く言語やな。

 

◆主なブラウザオブジェクト。ブラウザオブジェクトはインスタンス化済み。下記のインスタンス名で直接呼べると。

  • Window:すべてのブラウザオブジェクトの親 [window]
  • Navifator:ブラウザ情報を管理 [navigator]
  • Location:URL情報を管理 [location]
  • History:閲覧履歴を管理 [history]