2021-06-01 (50일차) 버튼 클릭시 배경색 변경, 팝업창 생성, 팝업창 닫기, 모든 태그에게 일괄하여 값 주기

15강~20강

 

JAVASCRIPT

 

- 버튼 클릭시 배경색 변경되는 효과 (방법1)

  1단계 : console.clear();
  2단계 : 제이쿼리 불러오기
  3단계 : 버튼 => changeBodyBackground() => console 실행됨 메세지
  4단계 : changeBodyBackground() => 배경색 red
  5단계 : no 변수 생성, 초기값 0, changeBodyBackground() => no 값 출력
  6단계 : changeBodyBackground() => no 값 증가
  7단계 : changeBodyBackground() => 배경색 변경

방법1

 

- 버튼 클릭시 배경색 변경되는 효과 (방법2)
1단계 : console.clear();
2단계 : 제이쿼리 불러오기
3단계 : 버튼 => changeBodyBackground() => console 실행됨 메세지
4단계 : changeBodyBackground() => 배경색 red[]
5단계 : isRed 변수 생성, 초기값 false, changeBodyBackground() => isRed 값 출력
6단계 : changeBodyBackground() => isRed 값이 변경
7단계 : changeBodyBackground() => 배경색 변경

방법2

- 모든 버튼에게 값을 주는 방법 (여러 개의 버튼이 있다고 가정)

  버튼에 클릭 이벤트를 건다.
  버튼이 클릭되면, changeBodyBackground 함수가 실행된다.

 

 

---

 

- 버튼 클릭시 팝업창 생성

 

 

- 버튼 클릭시 팝업창 닫기