본문 바로가기

전체 글

 (211)
JQuery_제이쿼리 문서 객체 선택자와 조작법(2) 4. 탐색 선택자 : 탐색 선택자를 사용하면 기본 선택자로 선택한 요소 중 원하는 요소를 한 번 더 탐색해서 좀 더 정확하게 선택한다. - 위치 탐색 선택자 : 기본 선택자로 선택한 요소는 배열에 담긴다. 이때 배열의 인덱스를 사용하면 특정 요소를 더 정확하게 선택할 수 있다. 종류 사용법 설명 $("요소 선택:first") $("요소 선택").first() $("li:first") $("li").first() 전체 요소 중 첫 번째 요소만 선택한다. $("요소 선택:last") $("요소 선택"):last() $("li:last") $("li").last() 전체 요소 중 마지막 요소만 선택한다. $("요소 선택:odd") $("li:odd") 요소 무리 중 짝수 번째(홀수 인덱스)요소만 선택한다. $..
JQuery_제이쿼리 문서 객체 선택자와 조작법(1) 1. 제이쿼리란? : 자바스크립트를 이용해 만든 라이브러리 언어(자바스크립트로 만들어진 다양한 함수들의 집합)이다. 2. 선택자 : 선택자는 HTML요소를 선택하여 가져온다. CSS는 정적인 반면 제이쿼리는 동적으로 스타일을 적용할 수 있다. -선택한 요소에 지정한 스타일을 적용할 때 $("CSS 선택자").css("스타일 속성명", "값"); -선택한 요소에 지정한 속성을 적용할 때 $("CSS 선택자").attr("속성명", "값"); -직접 선택자 구분 종류 사용법 설명 직접선택자 전체 선택자 $("*") 모든 요소를 설명한다. 아이디 선택자 $("#아이디명") id 속성에 지정한 값을 가진 요소를 선택한다. 클래스 선택자 $(".클래스명") class 속성에 지정한 값을 가진 요소를 선택한다. 요..
JavaScript_함수(2) 7. 함수 스코프 : 변수 또는 함수의 유효 범위 -var 변수명; → 전역 변수 function 함수명() { var 변수명; → 지역 변수 } -즉시 실행 함수 -(function() { 자바스크립트 코드; }()); (function() { var 변수명; //지역 변수 function 함수명() { //지역 함수 자바스크립트 코드; } }()); 8. 객체 생성자 함수 -new 키워드를 사용해 객체를 생성하고 객체 생성자 함수에서 this 키워드를 사용해 생성한 객체에 속성과 함수를 등록한다. function 함수명(매개변수1, 매개변수2, ...매개변수n) { //객체 생성자 함수 this.속성명=새 값; this.함수명=function() { 자바스크립트 코드; } } var 참조 변수(인스턴..
JavaScript_함수(1) 1. 함수 선언 -function 함수명() { 자바스크립트 코드; } -참조 변수=function() { 자바스크립트 코드; } =>함수 정의문 {...}안에 작성된 코드는 즉시 실행되지 않는다. 함수를 호출하는 기본형은 함수명(); 또는 참조 변수(); 2. 함수 호이스팅 : 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효범위의 최상단에 선언하는 것이다. var 변수 선언과 함수 선언문에서만 호이스팅이 일어난다. (함수 호출문이 먼저 나와도 호이스팅 방식이 적용되어 정상적으로 함수를 호출한다.) 3. 매개변수가 있는 함수 정의문 -function 함수명{(매개변수1, 매개변수2,... 매개변수n) 자바스크립트 코드; } 함수명(데이터1, 데이터2,... 데이터n); 4. 매개변수 없이 함수에..
JavaScript_객체 1. 객체 : 자바스크립트는 객체 기반 언어이고, 기능(Method)과 속성(Property)을 가지고 있다. -객체.메서드(); 객체.속성; 또는 객체.속성=값; -객체의 종류 : 내장 객체는 자바스크립트 엔진에 내장되어 있어 필요한 경우 생성해서 사용한다. ex) 문자(String), 날짜(Date), 배열(Array), 수학(Math) 브라우저 객체 모델은 브라우저 계층 구조로 내장되어 있는 객체이다. ex) window, screen, location, history, navigator 문서 객체 모델은 HTML 문서 구조이다. 2. 내장 객체 -참조 변수(인스턴트 이름)=new 생성 함수() -날짜 정보 객체(Date Object) -수학 객체(Math Object) -배열 객체(Array Ob..
JavaScript_제어문과 조건문, 선택문, 반복문 1. 제어문이란 프로그램 흐름을 제어할 수 있도록 도와주는 문장이다. -제어문에는 조건을 만족하는지의 여부에 따라 코드를 제어할 수 있는 조건문(if문/ else문/ else if문), 변수에 일치하는 경우의 값에 따라 코드를 제어할 수 있는 선택문(switch문), 특정 코드를 여러 번 반복해서 실행할 수 있도록 하는 반복문(while문/ for문)이 있다. 2. 조건문 - if문 : 조건식을 만족(true)할 경우에만 코드를 실행한다. if(조건식) { 자바스크립트 코드; } ex)var num=10; if(num true를 반환하여 웹페이지에 hello문구가 나옴. -조건식에 논리형 데이터가 아닌 다른 형이 오는 경우 : 조건식에 논리형 데이터 (true, false)가 아닌 다른 형의 데이터가 입..
JavaScript_변수, 연산자 안녕하세요! 전에 공부하던 책을 다 배우고 나서 자바스크립트가 어렵다는 걸 느끼고 이번엔 자바스크립트를 중점으로 공부하려고 다른 책을 구매했습니다. 두번째 교재로는 _이지스퍼블리싱으로 선택했습니다. 아자아자! 1. 변수(Variables)란 변하는 데이터를 저장할 수 있는 메모리 공간이다. 변수를 선언할 때는 var 변수명; 또는 var 변수명=값; 으로 선언한다. 변수에 저장할 수 있는 자료형 -문자형 : var 변수="사용할 문자나 숫자"; -숫자형 : var 변수=숫자; 또는 Number("문자형 숫자"); -논리형 : var 변수=true or false; 또는 Boolean(); => Boolean()은 숫자 0과 null, undefined, 빈 문자(" ")를 제외한 모든 데이터에 true를..
JavaScript_조건문, 비교연산자와 불리언, 리팩터링, 배열, 반복문 1. 비교 연산자와 불리언 ex) => 웹페이지에 ture 라고 나타남. 하지만 1===2로 하면 false로 나타남. -비교 연산자란 좌항과 우항의 관계에 따라 true또는 false 중 하나의 값을 만들어내는 연산자이다. 그리고 true와 false 두 가지 값을 묶어서 불리언이라고 한다. 2. 조건문 ex) document.write("1 "); if(true) {document.write("2 ");} else {document.write("3 ");} => 웹 페이지에 1 로 나타남 2 - if 문의 뒤에 따라오는 괄호 안에는 불리언 데이터 타입(true나 false)이 나오는데, true면 첫번째 중괄호 안의 코드가 실행되고, 두번째 중괄호 안의 코드는 무시된다. 반면, false라면 첫번째 ..

티스토리툴바