본문 바로가기

Front/JQuery10

[JQuery-3.6.0] 요소(속성) 조작, 수치 조작 메서드 요소 조작 메서드 : 요소를 생성, 복사, 삭제, 속성 변환과 관련된 메서드를 제공. 1. 속성 조작 메서드 2. 수치 조작 메서드 - html() : 선택한 요소에 포함되는 하위 요소를 불러오거나 새 요소로 바꿀 때 사용. - text() : 선택한 요소 내의 텍스트를 불러오거나 텍스트를 바꿀 때 사용. - removeAttr("속성") : 선택한 요소에서 기존의 속성을 삭제할 때 사용. - attr("속성") / attr("속성","값) : 선택한 요소에 새 속성을 추가하거나, 기존의 속성을 변경할 때 사용 - addClass() : 선택한 요소에 클래스 선택자를 생성할 때 사용. - removeClass() : 선택한 요소에 지정된 클래스 선택자를 삭제할 때 사용. - val() / val(값) :.. 2021. 4. 28.
[JQuery-3.6.0] 속성 탐색 선택자 속성 탐색 선택자 : 요소의 지정된 속성을 기준으로 선택함. 1. 요소[속성] : 속성이 있는 요소 가져오기 2. 요소[속성=값] : 속성과 값이 일치하는 요소 가져오기 3. 요소[속성^=값] : 값으로 시작하는 요소 가져오기 4. 요소[속성$=값] : 값으로 끝나는 요소 가져오기 5. 요소[속성*=값] : 값을 포함하는 요소 가져오기 6. 요소[속성=값][속성=값] : and 조건으로 조건 2개의 속성과 값을 모두 만족하는 요소 가져오기 구글 네이버 다음 네이트 메일 G 메일 다음 메일 2021. 4. 28.
[JQuery-3.6.0] 기본 문법과 위치 선택자 사용 * 제이쿼리를 이용하여 DOM을 조작하는 방법 형식) $("선택자").동작함수("속성","값"); 1. jQuery(document).ready(function () {}); 2. JQuery(function() {}); 3. $(document).ready(function () { }); - 표준 4. $(function () { }); 기본 문법 Header1 Header2 Header3 Header4 Header5 전체 선택자 Insert title here 제이쿼리 직접 선택자 및 관계 선택자 직접 선택자 관계 선택자 아이디, 클래스, 태그, 그룹 선택자 제이쿼리 직접 선택자 및 관계 선택자 직접 선택자 관계 선택자 부모, 하위(자손과 자식), 자식 선택자 Insert title here 인접 관.. 2021. 4. 27.
[JQuery-3.6.0] 제이쿼리의 기본 개념 * 제이쿼리(JQuery)? - 자바스크립트 언어를 간편한게 사용할 수 있도록 단순화시킨 오픈 소스 기반의 자바스크립트 라이브러리. - 제이쿼리는 자바스크립트 DOM을 좀 더 쉽게 작업하기 위한 라이브러리 덩어리. - 제이쿼리를 이용하면 문서 객체 모델(DOM)과 이벤트에 관한 처리를 손쉽게 구현할 수 있음. * 제이쿼리 사용 이유 - 제이쿼리는 주요 웹 브라우저의 구버전을 포함한 대부분의 브라우저에서 지원됨. - 동적으로 HTML DOM을 손쉽게 조작할 수 있으며, CSS 스타일도 간단히 적용 가능. - 생산성 있게 아주 짧고 간결하게 코딩이 가능하여 불필요한 소스를 줄일 수 있음. - 애니메이션 효과나 대화형 처리를 간단하게 적용할 수 있음. - 같은 동작을 하는 프로그램을 더욱 짧은 코드로 구현할 .. 2021. 4. 27.