Language56 [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. [JS] 객체 생성 Object 자바스크립트 객체 자바스크립트의 객체는 키(Key)와 값(Value)으로 구성된 프로퍼티(Property)와 메소드의 집합이다. 프로퍼티의 값으로 자바 스크립트에서 사용할 수 있는 모든 값을 사용할 수 있다. 객체 생성 방법 new Object( ) 생성자 함수 객체 리터럴 new Object( ) 이용해서 객체 생성 Object 객체 생성 : new 키워드로 Object 생성자 함수를 호출하면 비어있는 객체가 생성된다. var 생성자명 = new Object(); var fruits = new Object(); 프로퍼티 추가 : 비어있는 객체에 프로퍼티를 추가해준다. 생성자명.key = value; fruits.one = "Apple"; fruits.two = "Banana"; fruits.three .. 2019. 11. 20. [JS] 도큐먼트 탐색 메소드 Document 도큐먼트 Document Document 객체란 웹 페이지 그 자체를 의미한다. 웹 페이지에 존재하는 HTML 요소에 접근하고자 할 때 Document 객체의 수많은 속성과 메소드를 사용할 수 있다. 그 중 HTML 요소를 탐색하는 메소드를 알아보자. document.querySelector 해당 메소드는 CSS 선택자로 선택되는 요소를 모두 선택한다. 이와 같이 거의 모든 CSS 선택자를 사용할 수 있다. document.querySelectorAll("#아이디"); document.querySelectorAll(".클래스"); https://mintparc.tistory.com/82?category=803008 [CSS] 선택자 Selector CSS 선택자 스타일 속성을 적용하는 요소를 선택자라고 .. 2019. 11. 20. [JS] 리터럴 Literal 2019. 11. 20. [JS] 함수 Function 함수선언 명시적 함수 (함수 선언문) Function Statements 함수는 자바 스크립트에서 기본적인 구성 블록 중 하나이다. 함수는 작업을 수행하거나 값을 계산하는 문장 집합 같은 자바 스크립트 절차이다. 기본적인 함수 정의 방법은 다음과 같다. 마지막에 세미콜론(;)을 붙이지 않는다. function 함수명(){ 실행문; } function 함수명(파라미터){ 실행문; } 익명 함수 (함수 표현식) Function Expressions 일반적인 함수 선언 방식은 함수명을 명시하지만, 모든 함수가 항상 이름을 가져야 하는 것은 아니다. 함수 표현식에 의해서 작성할 수도 있다. 이러한 함수표현은 특정 변수에 저장되거나 즉시 실행 가능한 코드 블록으로서 존재한다. 마지막에 세미콜론(;)을 붙여준다. .. 2019. 11. 20. 이전 1 2 3 4 5 6 7 다음
