More than 3 years have passed since last update.

JavaScript基礎まとめ③

Posted at 2020-11-25

1.オブジェクト

Javascriptにおけるオブジェクトは
大きなオブジェクトの中に、またオブジェクトがあり、その中にまたオブジェクト、
プロパティがある。

例えば


let human = {
  men:{
   name: "yamada",
   age : 20,
  }
 }
 
 console.log(human.men.name)


///yamadaと表示されます///

ここでオブジェクト名がｈuman、プロパティ名がnameになる。

プロパティを追加、今ある値を変更するときには

let human = {
  men:{
   name: "yamada",
   age : 20,
  }
 }
human.age = 25
/// age を変更///
human['address'] = 'Tokyo'
///addressのプロパティを追加///

となる。

２．documentオブジェクト


document.getElementById("id名")
	
document.getElementsByClassName("class名")

document.querySelectorAll("セレクタ名")
	
document.querySelector("セレクタ名")

3.イベント発火
〇〇したら＊＊するの
〇〇したら　＝イベント
〇〇したら＊＊するの一連の流れをイベント発火という。

イベント発火に使う関数はaddEventListenerメソッド。

要素.addEventListener('イベント名', 関数)

イベント名は「クリックしたら」とか「カーソルが来たら」とか
それぞれ定義されている。

〇〇したら＊＊するの
＊＊するもう少し深堀りすると
例えばカーソルが指定の要素に乗っているときは色が変わり、
要素から外れたときには色が戻るととかは

要素.setAttribute(name, value)
/// nameのvalue(値）を指定する///
要素.removeAttribute(name, value)
///　nameのvalue(値）をとりのぞく////

普段使っているサイトを見ていくとJavaScriptかなり使われていそうだなと
基礎を勉強していくだけでも感じました。

間違い等あればコメントお願いいたします！