10/20 공부

console.dir: 자바스크립트에서 표현하는 element를 object를 통해서 자세히 볼 수있다.

javascript object property 

on~ 이벤트

 

EventListener function의 첫번째 함수의 인자로 방금 일어난 event 에대한 내용 제공해준다.

정보를 받고싶으면 함수의 인자를 만들어주면 됨 

function onLoginsubmit (tomato){   tomato.preventDefault();   console.log(tomato); } LoginForm.addEventListener('submit',onLoginsubmit)

tomato.preventDefault: 기본으로 설정된 브라우저이벤트 막음

submit event에대한 정보 

 

local stroage 

application - localstorage

localstorage함수

setItem localStorage.setItem("key", value) 정보저장

getItem 불러오기

removeItem 지우기 

 

const HIDDEN_KEY = "hidden" ;

여러번 반복되어 사용하는  string만 포함 된 변수는 대문자로 표기한다. 

변수로 저장하는 이유: 변수로 사용했을 시에 오타를 오류가 발생했다고 잡아주지만 잘못 작성한 문자열은 오류로 잡아주지 못한다.

 

className과 classList

className: 이전 클레스 상관없이 교체

classList : class를 목록으로 가져와 사용 

   classList.contains()

   classList.remove()

   classList.add()

   classList.toggle() //껏다 키는 기능. classList.toggle("acitve")

 

---

input의 유효성검사 동작하기위해서 외부에 form으로 감싸있어야한다.

<form>

  <input required maxlength="15" type="text" placeholder="이름을 입력해주세요">

</form>

 

input이 남아있지 않을 때 엔터를 누르나

input 안에 <button> 누르거나 <input type="submit">을 누르면 자동으로 form이 submit된다.

 form submit의 기본동작 --> 새로고침