#  해당 요소의 이전 위치에 요소 추가$("기존_요소").before($("추가할_요소"));// 또는$("기존_요소").before(" ... ");#  해당 요소의 다음 위치에 요소 추가$("기존_요소").after($("추가할_요소"));// 또는$("기존_요소").after(" ... "); #  해당 요소 내부의 처음 위치에 요소 추가$("요소").prepend($("추가할_요소"));#  해당 요소 내부의 마지막 위치에 요소 추가$("요소").append($("추가할_요소")); #  해당 객체 복제$("요소").clone(true|false);  - true : 하위 요소까지 모두 복제  - false : 선택한 요소만 복제  - clone() 없이 다른 요소에 append 등을 실행하면 ..

#  배열에서 특정 값 찾기$.inArray("찾을_값", 배열, [시작인덱스]);  - 배열에서 해당 값을 가진 요소의 인덱스를 반환함  - 찾지 못하면 -1을 반환함#  배열인지 확인$.isArray(배열); #  배열 a에 배열 b 병합$.merge(배열a, 배열b);#  요소 배열 중에 특정 조건을 만족하는 요소의 인덱스 찾기$("요소").index(조건);// ex: $("li").index($("#list3")); -> li 요소 중에 id가 'list3'인 요소의 인덱스#  배열의 인덱스 순서대로 하나씩 접근 (foreach)$("요소").each(function(인덱스, 배열값) { // 코드 });// 또는 $.each(배열, function(인덱스, 배열값) { // 코드});#  배열..

1. 이미지 추가 및 스타일 설정2. ajax 통신 코드  - 통신 중에는 로딩 스피너가 표시되고, 통신이 끝나면 로딩 스피너가 사라짐$("요소").on("click", function() { // 가장 위 (로딩 스피너 표시) $("#loadingImage").show(); // ... $.ajax({ type : "post", url : ajaxurl, ... }).done((res) => { // 통신 성공 시 // 가장 아래 (로딩 스피너 숨김) $("#loadingImage").hide(); }).fail((error) => { // 통신 실패 시 // 가장 아..

직접 선택자  - 전체 선택자 : $("*")  - 아이디 선택자 : $("#아이디명")  - 클래스 선택자 : $(".클래스명")  - 태그 선택자 : $("태그명")  - 그룹 선택자 : $("요소1, 요소2, ..., 요소n")  - 종속 선택자      1) 해당 요소 중 class a를 갖는 요소 선택 : $("요소명.a")      2) 해당 요소 중 id a를 갖는 요소 선택 : $("요소명#a")  인접 관계 선택자#  상위 요소 관련  - 요소 a의 부모 요소 선택 : $("요소a").parent()  - 요소 a의 모든 상위 요소 선택 : $("요소a").parents()  - 요소 a의 상위 요소 중 요소 b를 모두 선택 : $("요소a").parents("요소b")  - 요소 a의 ..

jQuery  - JavaScript를 이용하여 만든 라이브러리 언어  - 더 적게 작성하고, 더 많이 수행하는 경량 JavaScript 라이브러리  - 쉽고 편리한 애니메이션 효과 기능 구현  - 웹 사이트에서 js를 훨씬 더 쉽게 사용할 수 있도록 하는 것    - HTML/DOM 처리  - css 핸들링 가능  - 이벤트 등록 및 삭제 핸들링 가능  - 애니메이션 처리를 쉽게 사용  - AJAX (비동기 통신 처리) 가능  jQuery 사용하기  방법 ①      - https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.js      - [Ctrl] + [S]로 jquery.js 파일을 js 폴더에 저장      - 부분에 아래 코드 입력  방..