본문 바로가기
레거시

2022.1.3의 기록

by GroovyArea 2022. 1. 3.

오늘 아침 풍경. 날씨 좋~다

- 오늘의 평가 및 느낀 점 - 

=> 1월의 첫 월요일이다. 나이를 한살 더 먹었으니 더 내가 할 수 있는 것에 대해 생각하는 한해가 되어야겠다.

=> 파이널 조가 정해졌다. API 각자 주제 정해서 조금씩 알아보기로 했다. 노력한만큼 얻는게 결과니 3개월 죽었다 생각하고 꼭 올해는 좋은 성취도가 있기를 희망하게 정진하자.


- 이번 주 공부 계획 -

> Todo List 되는 곳 까지 

> 세미 팀플 DB 구상 / 디자인


- 공부 내용 - 

jQuery

Form Event

  • 입력 값 검증 시 boolean 변수 선언으로 일괄 처리 가능
  • $(selector).blur(callback) : 검색 엘리먼트 (입력태그)에서 입력 초점이 다른 엘리먼트로 이동하는 경우 발생되는 이벤트에 대한 이벤트 처리 함수를 등록하는 메소드 ⇒ $(selector).focusout(callback) 메소드와 동일
  • $(selector).val(value) : 검색 엘리먼트(입력태그)의 입력값을 변경하는 메소드
  • $(selector).submit(callback) : 검색 엘리먼트 (form 태그)에서 발생된 submit 이벤트에 대한 이벤트 처리 함수를 동록하는 메소드
  • 이벤트 처리 함수에서 false 반환하면 기본 이벤트 제거
  • 입력태그에 required 속성을 설정한 경우 입력값이 없으면 메시지를 출력하고 submit 이벤트를 취소 - form 태그 미동작

CheckBox Event

  • $(selector).prop(name, value) : 검색 엘리먼트(입력태그)의 상태를 변경하는 메소드 => checkbox, radio, select(option) 태그에서만 사용 가능 => name : checked 또는 selected, value : false(미선택) 또는 true(선택)
  • $(selector).change(callback) : 검색 엘리먼트(입력태그)의 입력값이 변경된 경우 호출되어 실행될 이벤트 처리 함수를 등록하는 메소드
  • $(selector).is(status) : 검색 엘리먼트(입력태그)의 상태를 비교하여 false 또는 true를 반환하는 메소드 => checkbox, radio, select(option) 태그에서만 사용 가능
  • $(selector).val(value) : 검색 엘리먼트(입력태그)의 입력값을 변경하는 메소드

Effect - Hide and Show

  • 검색 엘리먼트의 CSS 스타일 속성값을 비교하여 CSS 스타일 속성값 변경 가능
  • $(selector).show([duration]) : 검색 엘리먼트를 배치하여 보여지도록 설정하는 엘리먼트 ⇒ 지속시간 (duration : ms)을 전달하여 설정된 시간동안 변환 효과 제공 ⇒ 지속시간(duration)을 설정하지 않은 경우 기본값 0으로 설정
  • $(selector).hide([duration]) : 검색 엘리먼트를 미배치하여 숨겨지도록 설정하는 엘리먼트 ⇒ 지속시간 (duration : ms)을 전달하여 설정된 시간동안 변환 효과 제공
  • $(selector).toggle([duration]) : 검색 엘리먼트에 hide 기능과 show 기능을 반대로 제공하는메소드
  • $(selector).slideDown([duration]) : 검색 엘리먼트를 배치하여 보여지도록 설정하는 엘리먼트
  • $(selector).slideUp([duration]) : 검색 엘리먼트를 미배치하여 숨겨지도록 설정하는 엘리먼트
  • $(selector).fadeIn([duration]) : 검색 엘리먼트를 배치하여 보여지도록 설정하는 엘리먼트
  • $(selector).fadeOut([duration]) : 검색 엘리먼트를 미배치하여 숨겨지도록 설정하는 엘리먼트

Effect - Animate

  • $(selector).removeAttr(attrName) : 검색 엥리먼트의 태그 속성 제거하는 메소드
  • $(selector).animate(properties, duration[, easing][, callback]) : 검색 엘리먼트에 애니메이션 기능을 제공하는 메소드
  • ⇒ properties : 엘리먼트의 CSS 스타일 속성과 속성값을 JSON 형식의 Object 객체로 전달
  • ⇒ duration : 애니메이션 효과의 적용시간 (ms) 전달
  • ⇒ easing : 애니메이션 효과의 실행 속도를 전달 - https://easing.net 사이트 참조
  • ⇒ callback : 애니메이션 효과 적용 후 실행될 명령이 작성된 함수 전달
  • $(selector).stop() : 검색 엘리먼트에 적용중인 애니메이션 효과를 제거하는 메소드
  • $(selector).width() : 검색 엘리먼트의 폭을 반환하는 메소드

- 세미 팀플 -

> 화요일에 ppt 배포 및 각자의 역할 화면 정의 구상

> 수요일까지 화면 정의서 완성

> 목, 금 임포트한 프로젝트에서 각자 맡은 html 파일 찾기

> 토요일 팀 전체의견 취합 화면 정의서 구체화, DB 툴 이용하여 그려보기, 나머지 시간 되면 뭘할까 서블릿?

> KB, SH 토욜 ㅇㅋ / DH 토욜 안될 수도 있음(일욜 가능??) [ 토요일 강남 이지스터디 12~6시 예상?)


- 스터디 계획 및 결과 - 

> form 태그, submit 이벤트 중요

반응형

'레거시' 카테고리의 다른 글

2021.1.5  (0) 2022.01.05
2021.1.4의 기록  (0) 2022.01.04
2022.1.2의 기록 (25살의 첫 일요일)  (1) 2022.01.02
2021.12.31의 기록  (0) 2021.12.31
2021.12.30의 기록  (0) 2021.12.30