Leanna's code develop

Popular Content

• 16. HTML 제어하기 HTML 제어하기 1 _ 자바스크립트로 HTML 태그 / CSS 스타일 가져오기 1. HTML 속성 제어 HTML 태그 : Element 값이 있는 속성 : Atrribute 값이 없는 속성 : Property const mytag = document.getElementById( " ・・・・ " ); mytag.hasAttribute( name );ﾠﾠﾠ➞ﾠ속성의 존재 확인 mytag.getAttribute( name );ﾠﾠﾠ➞ﾠ속성 값 받아오기 mytag.setAttribute( name , value );ﾠﾠﾠ➞ﾠ속성 값 변경 mytag.removeAttribute( name );ﾠﾠﾠ➞ﾠ속성 값 제거 2. CSS 속성 제어 개별 속성을 하나하나 제어 class 단위로 제어 const mytag = document.getElementById( " ・・・・ " ); mytag.s..
• 12. 정규표현식 Regex 정규표현식 Regex 종류 _ 숫자 검사, 영문 검사, 한글 검사, 영문+숫자 검사, 한글+숫자 검사, 이메일 검사, 핸드폰 번호 검사, 주민번호 검사 1. 정규표현식이란? 문자열의 형식을 의미하는 수식 문자열이 특정 조건을 충족하는지 검사하거나 특정 패턴의 문자열을 검색, 치환하기 위해 사용 const 변수 이름 = / 정규표현식 / ﾠﾠﾠ➥ 문자열이 정규표현식에 부합하는지 확인하려면 " 변수이름 . test( 검사할 문자열 ) "로 확인 가능 2. /^[0-9]*$/ 숫자인지 검사하는 코드 3. /^[a-zA-Z]*$/ 영문으로만 구성되었는지 검사하는 코드 4. /^[ㄱ-ㅎ가-힣]*$/ 한글로만 구성되었는지 검사하는 코드 5. /^[a-zA-Z0-9]*$/ﾠﾠ혹은ﾠﾠ/(?=.*[0-9])(?=.*[a-zA-Z])/ 영문 + 숫자로만 구성되었는지 검사하는 코드 (?=.*[0-9])ﾠ➞ﾠ한 글자라도 숫자가 포함되어야 함 (?=.*[a-zA-Z])ﾠ➞ﾠ한..
• 16. HTML 제어하기 HTML 제어하기 2 _ dataset 속성 사용, 탭 메뉴 제어(QnA 혹은 공지사항), 배너 슬라이드 1. dataset 속성 2. 탭 메뉴 제어 3. 배너 슬라이드
• 15. 이벤트 이벤트 _ 이벤트 리스너, 이벤트 핸들러, 마우스 이벤트, 키보드 이벤트, form 이벤트, 브라우저 이벤트, 트랜지션 이벤트 1. 이벤트란? 프로그램이 겪는 어떠한 사건 -ﾠ사용자의 클릭, 마우스 오버 -ﾠ페이지 로딩 직후, 페이지 종료 직전 ➥ 자바스크립트가 제공하는 브라우저 관련 기능 안에 다양한 이벤트를 감지하는 기능이 구현되어있다. 2. 이벤트 리스너 ( 多 사용 ) 어떤 이벤트가 발생하기를 기다렸다가 이벤트 발생 시 연결된 ' 콜백 함수 ' 를 호출해주는 기능 객체 . addEventListener( ' 이벤트 이름 ' , 콜백 함수 ) ; ➥ 객체 : html 태그 ➥ 이벤트를 감지하는 것은 자바스크립트 안에 이미 내장되어 있지만, ﾠﾠ어떤 이벤트가 발생했을 때 수행할 동작은 웹페이지마다 다를 수밖에 없으므로 ﾠﾠ페이지마다 개별 구현이 필요하다. 3. 이벤트 핸들러 ( 少 사용 ) HTML 태그의 속성 형태로 존재하..
• 14. 비동기처리 비동기 처리 _ 추첨 기능, 콜백 헬, promise, async await 1. 비동기 처리란? 상위 코드가 작업이 종료가 되지 않아도 다음 코드를 실행시키는 것 예를 들어 어떤 버튼을 클릭하여 실행될 때 ' 10초 ' 가 걸린다고 가정했을 때, 그 ' 10초 ' 가 걸리는 동안 다른 버튼을 클릭하는 등 다른 활동이 가능하다. 하지만 자바스크립트가 비동기 처리가 아닌 동기 처리이면 ' 10초 ' 가 지나야 다른 활동을 할 수 있다. 2. Promise 자바스크립트 " 콜백 헬 " 에서 벗어나게 해주는 함수 작업이 ' 성공했을 때 ' 와 ' 실패했을 때 ' 의 코드를 완벽히 분리 가능 " promise " 를 가동하기 위해서는 " promise " 객체를 리턴하는 함수가 필요 3. Async ~ Await "promise " 함수를 좀 더 깔끔하게 정리 " promise " 객체..
• 13. 예외처리 예외처리 _ Syntax Error, Runtime Error, 고전적 예외처리, try-catch-finally 구문, 에러객체를 활용한 예외처리, 에러클래스를 활용한 예외처리 1. 예외처리란? 사용자가 적는 값이 정해진 규칙에 준수하지 않을때 일부러 에러를 발생시키는 것 논리적 구조로 대비할 수 없는 예외 상황에 대응하기 위해 " try - catch - finally " 문법 구조로 처리 예외처리를 사용하는 이유 : 예를 들어 사용자값을 받아오는 ' 회원가입 ' 같은 경우에서 정해진 규칙대로 입력하지 않았을때 에러가 발생하도록 규정하기 위해 2. 고전적인 예외처리 프로그램이 실행하기 적합하지 않은 파라미터가 전달된 경우, 미리 약속된 값을 리턴하는 방법 ( 프로그램의 성공, 실패 여부를 리턴값으로 판단 ) 3. 기본적인 에러 핸들링 " try " 코드 실행 후 에러가 없다면, " try " 안의 마지막 줄까지 실행되고, " catch( error ) " 블록은 건너뜀 " t..