코밍이의 하루

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 객체 편집 메소드 - 객체를 생성하거나 삭제 또는 복제할 때 사용 종류 사용법 설명 before() $("요소 선택").before("새 요소"); 선택한 요소의 이전 위치에 새 요소 추가 after() $("요소 선택").after("새 요소"); 선택한 요소의 다음 위치에 새 요소 추가 append() $("요소 선택").append("새 요소"); 선택한 요소의 마지막 위치에 새 요소 추가 appendTo() $("새 요소").appendTo("요소 선택"); 선택한 요소의 마지..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 수치 조작 메소드 - 요소의 너빗값 또는 높잇값 같은 수치를 바꿀 때 사용 종류 사용법 설명 height() $("요소 선택").height(); $("요소 선택").height(100); 안쪽 여백과 선을 제외한 높잇값을 반환하거나 변환 width() $("요소 선택").width(); $("요소 선택").width(100); 안쪽 여백과 선을 제외한 너빗값을 반환하거나 변환 innerHeight() $("요소 선택").innerHeight(); $("요소 선택").innerHeig..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 객체 조작 메소드 - 객체를 생성, 복제, 삭제, 속성 변환 - 종류 : 속성 조작 메소드, 수치 조작 메소드, 객체 편집 메소드 2) 속성 조작 메소드 - 요소의 속성을 조작할 때 사용 종류 사용법 설명 html() html("새 요소") $("요소 선택").html(); $("요소 선택").html("새 요소"); - 선택한 요소의 하위 요소를 가져옴 - 선택한 요소의 하위 요소를 모두 제거하고, 그 위치에 지정한 새 요소를 생성함 text() text("새 텍스트") $("요소 ..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 콘텐츠 탐색 선택자 - 요소 또는 속성의 포함 여부에 따라 특정 요소를 선택하는 선택자 종류 사용법 설명 $("요소 선택:contains(텍스트)") $("li:contains('내용2')") 요소 중 title 속성이 포함된 요소만 선택 $("요소 선택").contents() $("p").contents() 요소 중 title 속성값이 '리스트'인 요소만 선택 $("요소 선택:has(요소명)") $("요소 선택").has(요소명) $("li:has('span')") $("li").h..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 속성 탐색 선택자 - 선택한 요소를 기준으로 일치하는 속성의 포함 여부를 따져 요소를 선택하는 선택자 종류 사용법 설명 $("요소 선택[속성]") $("li[title]") 요소 중 title 속성이 포함된 요소만 선택 $("요소 선택[속성=값]") $("li[title='리스트']") 요소 중 title 속성값이 '리스트'인 요소만 선택 $("요소 선택[속성^=텍스트]") $("a[href^='http:://']") 요소 중 href 속성값이 'http://'로 시작하는 요소만 선택..

1. 개발 환경 구분 내용 사용 언어 HTML5, CSS3, JS, jQuery 개발환경 Visual Studio Code 참고 도서 [Do it] 자바스크립트 + 제이쿼리 입문 웹브라우저 Chrome 2. 주요 문법 1) 배열 관련 메소드 종류 사용법 설명 each()/$each() $("요소 선택").each(function) $each($("요소 선택").function) - 배열에 저장된 문서 객체만큼 메소드 반복 실행 - 배열에 저장된 객체의 인덱스 순서대로 하나씩 접근하여 객체를 선택하고 인덱스를 구함 $.map() $.map(Array, function) - 배열에 저장된 데이터 수만큼 메소드 반복 실행 - 함수에서 반환된 데이터는 새 배열에 순서대로 저장 - 새로 저장된 배열 객체 반환 $..