Language/JavaScript14 [JSON] 제이슨 JSON JSON이란 JSON(JavaScript Object Notation)은 "속성, 값(name, value)" 쌍으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷이다. 경량(LightWeight)의 DATA 교환 방식이며 이 형식은 사람과 기계 모두 이해하기 쉽다. JSON은 특정 언어에 종속되지 않고 독립적이지만 대부분의 프로그래밍 언어에서 JSON 포맷의 데이터를 핸들링할 수 있는 라이브러리를 제공한다. 자바스크립트에서 객체를 만들 때 사용하는 표현식이며 비동기 브라우저/ 서버 통신(Ajax)을 위해, 넓게는 XML을 대체하는 주요 데이터 타입이다. 쉽게 말해, 네트워크를 통해서 데이터를 주고 받을 때 사용되는 경량의 데이터 교환 방식이다. JSO.. 2019. 12. 19. [JQ] 제이쿼리 부모, 자식 탐색 메서드 예시로 사용할 HTML * 부모, 자식 탐색 메서드 * 사과 바나나 키위 딸기 메론 find("selector") 메서드 $("element").find(["selector"]) 선택한 엘리먼트들의 자손들 중에 탐색하고자 하는 엘리먼트를 찾는다. children("selector") 메서드 $("element").children(["selector"]) 선택한 엘리먼트의 자식요소들 중에 탐색하고자 하는 엘리먼트를 찾는다. parent()/ parents("selector") 메서드 $("element").parent(["selector"]) $("element").parents(["selector"]) 선택한 엘리먼트의 부모/ 조상 엘리먼트를 찾는다. next("selector") 메서드 $("eleme.. 2019. 11. 25. [JQ] 필터 셀렉터 Filter Selector : first 엘리먼트의 첫 번째 요소 선택 $("element:first") : last 엘리먼트의 마지막 요소 선택 $("element:last") : even 엘리먼트의 짝수번째 요소를 모두 선택 $("element:even") : odd 엘리먼트의 홀수번째 요소를 모두 선택 $("element:odd") : eq (index) index에 해당하는 요소를 선택 $("element:eq(index)") : gt (index) index 이후의 요소를 선택 $("element:gt(index") : lt (index) index 이전의 요소를 선택 $("element:lt(index") : has (selector) selector요소를 하나 이상 포함하고 있는 요소를 선택 $("element:has.. 2019. 11. 25. [JQ] attr( ) 과 prop( ) 차이점 attr HTML의 속성(attribute)을 가져온다. 속성(Attribute)은 HTML 요소 안에 이름="값" 의 형태로 존재하면서 엘리먼트의 추가적인 정보를 담고 있다. prop JavaScript의 속성(property)을 가져온다. JavaScript로 가져온 dom 객체 (node, node list) boolean, date, function 등 2019. 11. 25. [JQ] 제이쿼리 설치 JQuery 제이쿼리 JQuery 제이쿼리란 오픈 소스 기반의 자바스크립트 라이브러리이다. 자바스크립트에서 자주 사용되는 로직들을 손쉽게 사용할 수 있도록 묶어놓아 사용이 간편하고 짧고 단순한 코드로 구현할 수 있다. 제이쿼리 사용하기 ① : 라이브러리 파일 다운로드 다운로드 사이트 https://jquery.com/download/ Download jQuery | jQuery link Downloading jQuery Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging; the compressed file saves bandwidt.. 2019. 11. 25. [JS] 도큐먼트 부모, 자식 탐색 부모탐색 : parentNode 선택한 요소의 부모를 탐색하는 속성은 parentNode 이다. 부모란 직계 상위 요소이기 때문에 두 개 이상일 수 없다. 따라서 Node 하나를 리턴한다. HTML p태그의 부모태그를 찾아보자! JS var p = document.getElementsByTagName("p")[0];// p요소 선택 var parent = p.parentNode; console.log(parent); // 선택된 p요소의 부모요소 리턴 자식탐색 : childNodes 선택한 요소의 자식을 탐색하는 속성은 childNodes 이다. 자식 노드는 한 요소에 하나 이상 존재할 수 있기 때문에 자식 노드들을 Node List로 반환해준다. HTML Chelsea FC FC Barcelona FC.. 2019. 11. 22. [JS] DOM Element 문서 객체 모델 The Document Object Model DOM 이란 XML이나 HTML 문서에 접근하기 위한 방법을 제공한다. 프로그래밍 언어는 제공된 방법에 따라 XML이나 HTML 문서의 문서 구조, 스타일, 내용 등을 변경할 수 있다. DOM 요소 선택 자바스크립트에서 HTML 요소를 다루기 위해서는 우선 해당 요소를 선택해야 한다. 특정한 요소를 선택하기 위해서 제공되는 방법은 여러가지가 있다. [JS] 도큐먼트 탐색 메소드 Document 도큐먼트 Document Document 객체란 웹 페이지 그 자체를 의미한다. 웹 페이지에 존재하는 HTML 요소에 접근하고자 할 때 Document 객체의 수많은 속성과 메소드를 사용할 수 있다. 그 중 HTML 요소를 탐색하는 메.. mintpar.. 2019. 11. 21. [JS] 배열 Array 배열 Array 자바스크립트의 배열이란 관련 있는 데이터들를 하나의 변수에 할당하여 관리하기 위해 사용하는 데이터 타입이다. 자바스크립트는 명시적 타입이 없는 언어이므로, 하나의 배열 내에 여러 자료형의 데이터를 담을 수 있다. 저장된 데이터는 인덱스를 이용하여 접근이 가능하다. 인덱스는 0부터 시작해서 배열의 길이 - 1까지 존재한다. 배열 선언/ 정의/ 초기화 기본적인 선언방식 new 키워드를 사용해서 배열을 선언하는 방법이다. var arr = new Array(); 선언과 정의를 동시에 하는 방식 배열의 길이가 5이고 초기값이 들어있지 않은 빈 배열을 생성한다. var arr = new Array(5); 선언과 정의, 초기화를 동시에 하는 방식 배열의 길이가 5이면서, 값이 들어있는 배열을 생성한.. 2019. 11. 21. [JS] 동등연산자 == / === 동등연산자 == == 연산자는 피연산자가 서로 다른 타입이면 타입을 강제로 변환하여 비교한다. var num = 10; if(num == "10"){ console.log("서로 같습니다."); } else { console.log("서로 같지 않습니다."); } // 서로 같습니다. 출력 숫자 10과 문자열 10을 비교했을 때 자동 형변환이 되어 둘이 서로 같다고 판단한다. 동등연산자(일치연산자) === === 연산자는 피연산자의 타입까지 엄격하게 비교하여 결과를 리턴한다. var num = 10; if(num === "10"){ console.log("서로 같습니다."); } else { console.log("서로 같지 않습니다."); } // 서로 같지않습니다. 출력 일치연산자는 숫자 10과 문자.. 2019. 11. 21. 이전 1 2 다음
