🚀이벤트(event ) 사용하기2~🚀 | JavaScript 시리즈 014

 

* document . 으로 시작하는 코드는 html의 element(요소)를 가져올때 사용하는 것!

 

Resize (창 사이즈 조절)

코드

window의 resize(창 사이즈 에 변화를 가하면 => handleWindowResize 함수가 실행됨.
--->함수 부분으로 가서 실행 코드를 살펴보면 document. 으로 시작하면 무조건 html 요소를 떠올린다!
그리고 body 요소에 style 에 배경색을 토마토 색을 ! 그럼 아래와 같이 출력됨.

결과

 

Copy (복사)

코드

이건 복사를 했을때 팝업창으로 경고를 띄울수 있게 만들수 있는 이벤트 코드이다.

아래와 같이 뜨는데 신기하다ㅋㅋ

결과

게속 코드를 보면 알다시피, element 를 찾아서 event listener를 추가하고, event 가 발생하면 반응을 해주는 원리!

 

 

 

---

 

WIFI :   와이파이 EVENT!!!! yea~~~

코드

우리가 wifi에 연결 돼 있는지 브라우저가 알 수 있다.
이벤트를 찾아보면 offline 과 online 이벤트가 있다.
->와이파이를 끄면 sos no wifi 라는 팝업이 뜬다. 
-> 와이파이를 켜면 all good! 라는 팝업창이 뜬다.