YJ의 새벽

Daum Postcode Service User Guide Daum 우편번호 서비스 우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다. postcode.map.daum.net 참고 !! ** jsp onclick="함수명" 에다가. onclick="return 함수명" 을 넣어주자 .

즉시 실행함수 ( 익명함수 ) -- ( function ([매개변수]) { // 함수정의 } ) ( ) ; -- 익명함수의 한 종류로써 함수가 정의 되자마자 실행하는 함수. -- 함수선언 및 호출을위한 탐색과정이 생략되기때문에 속도적 우위를 가지고있다. -- 변수명 중복을 방지할수 있다. -> 즉시실행함수 내부변수는 지역변수로 분류 . //변수명 중복돼도 상관없음. //페이지 로딩 시 바로 수행 ( function(){ const str = "저녁메뉴추천!!"; console.log(str); } )(); ( function(){ const str = "아무값이나 !!!!"; console.log(str); } )(); 화살표 함수 ★ ★ ★ 1. 기본형태 ([ 매개변수 ]) => { 함수정의 } ; f..

추가 계산 // 추가버튼 클릭시 동작 document.getElementById("add").addEventListener("click",function(){ // // // × // //div 요소 생성 const div = document.createElement("div"); // //div에 row class 추가 div.classList.add("row") // //input 요소 생성 const input = document.createElement("input"); // //input에 in class 추가 input.classList.add("in"); // //input 에 type="number" 추가 input.setAttribute("type","number"); // // 요소에 ..

DOM ( Document Object Model ) -- HTML (웹문서,웹페이지) 문서를 객체 기반으로 표현한 것 -- HTML 문서에 작성된 내용을 트리구조 ( 계층형 ) 으로 나타냈을때 각각의 태그 , TEXT , COMMENT 등을 Node 라고 한다. Node 와 Element 의 차이 -- Node : 태그 (요소 노드) , 속성, 주석, 내용(텍스트 노드) 등을 모두 표현 -- Element : Node 의 하위 개념으로, 요소 노드만을 표현. Node 탐색 -- 부모 - 요소. parentNode : 요소의 부모 노드를 탐색해서 반환 -- 자식 - 요소. childNodes : 요소의 자식 노드를 모두 반환 ( NodeList 형태 ) - 요소. firstChild : 첫번째 자식 노드..

자바 스크립트 객체 -- 자바 스크립트의 객체는 { } 안에 Key : value 가 모여있는 형태로 작성된다. (Map 형식) -- 자바 스크립트 객체 = { K : V , K : V , K : V } .. -- 자바 스크립트 객체 모양의 문자열 - JSON ( JavaScript Object Notation ) 자바스크립트 객체 표기법 --> " { K : V , K : V , K : V } " -- 자바 스크립트에서 객체 생성하는 방법 1. { } : 객체 리터럴 표기법을 이용한 생성 2. 생성자 + new 생성자( ) 를 이용한 생성 - JS 객체의 Key 는 무조건 string (묵시적 string) -> Key 작성시 " " , 모두 string 으로 인식 --객체의 값을 얻어오거나 대입하는 ..

window 객체 -- 브라우저 창 자체를 나타내는 객체 -- window 객체는 JS에서 최상위 객체이며 , DOM , BOM 으로 분류된다. DOM ( Document Object Model ) : HTML 문서 자체를 나타내는 객체 ( document ) BOM ( Browser Object Model ) : location , history , screen , navigator ( 페이지의 이동 ) -- window 객체는 창 자체를 나타내고 있으므로 , 브라우저 창 내에서 어디서든 접근 가능 . window 객체의 속성과 기능 호출시 window 단어 생략 가능 . ex ) window.alert () == alert () -- 시간 관련된 함수는 비동기 ! ( 코드인식은 순서대로 진행되지만, ..

문자열 -> 숫자 ( 형변환 ) -- 요소의 내용 또는 값을 얻어오면 기본적으로 문자열 (string)로 인식됨. --> 덤셈 연산 시 '더하기' 가 아닌 '이어쓰기' 가 되는 문제 발생 - parseInt (문자열) : "정수" -> 정수( "123" -> 123 ) "실수" -> 정수( "3.14" -> 3 ) 소수점 버림 - parseFloat (문자열 ) : "정수" -> 정수( "123" -> 123 ) "실수" -> 정수( "3.14" -> 3.14 ) - Number( 문자열 ) : "정수" -> 정수 ("123" -> 123 ) "실수" -> 실수 ( "3.14" -> 3.14 ) 형변환 확인 const btn1 = document.getElementsByClassName("btn1")[0..

정규표현식 ( Regular Expression ) -- 특정한 규칙을 가진 문자열 집합을 표현, 사용하는 형식 언어. -- 정규표현식을 이용하면 입력한 문자열에 대한 특정 조건 검색, 일치 여부 판단, 치환에 대한 조건문을 간단히 처리할수 있다. ---- 참고 사이트 (( 작성한 정규표현식을 그림으로 나타내줌 )) Regexper regexper.com ---- 참고사이트 (( 정규표현식 테스트 )) RegExr: Learn, Build, & Test RegEx RegExr is an online tool to learn, build, & test Regular Expressions (RegEx / RegExp). regexr.com ---- 참고사이트 (( MDN - 정규표현식 )) 정규 표현식 - ..