jQuery

1. contents(내용) 가져올 때 사용하는 method 1) text() : 문자열로 가져오는 메서드 2) html() : html 요소로 가져오는 메서드 3) val() : value를 가져오는 메서드 2. attribute(속성) 가져오거나 설정할 때 사용하는 method 1) attr() - 속성 값 가져올 때 예시: $("a").attr("href"); - 속성 값 설정할 때 예시 : $("a").attr("href", "http://www.naver.com"); 3. element(요소) 추가할 때 사용하는 method 1) append() : 마지막 자식으로 추가 부모요소.append(자식요소) 2) appendTo() : 마지막 자식으로 추가 자식요소.appendTo(부모요소) 3) p..

1. animate() 메서드 [형식] $(selector).animate({params}, speed, callback); 1) {params} 매개변수는 css 속성 정의 2) speed 매개변수는 효과의 지속 시간을 정의 ㄱ. "slow" - 천천히 ㄴ. "fast" - 빠르게 ㄷ. ms - 밀리세컨드 값을 넣어서 직접 설정할 수도 있음 3) callback은 애니메이션 효과가 완료된 후에 실행 1-2. 요소의 위치를 이동시키기 위해서는 style position 속성을 absolute를 주어야 함 1-3. 여러 속성을 동시에 애니메이션 처리할 수 있다. 1-4. 상대적인 값을 정의하는 것도 가능하다. - 기준은 현재 요소의 값이며, += 또는 -=으로 값을 설정해주면 된다. 1-5. 미리 정의된 ..

1. 제이쿼리(jquery)란? - jQuery는 빠르고 작고 기능이 풍부한 JavaScript 라이브러리 - 여러 브라우저에서 작동하는 사용하기 쉬운 API를 사용하여 1) HTML 문서 탐색 및 조작 (DOM) 2) 이벤트 처리 3) 애니메이션 및 Ajax 위와 같은 작업을 훨씬 더 간단하게 만듦 - 다목적성과 확장성의 조합으로 jQuery는 수백만 명의 사람들이 JavaScript를 작성하는 방식을 변화시킴 2. jquery 사용하는 방법 1) 다운로드 ㄱ. 압축 => jquery-3.6.0.min.js - 대역폭 절약, 프로덕션 성능 향상 시킴 ㄴ. 비압축 => jquery-3.6.0.js - 개발 또는 디버깅에 가장 잘 사용됨 즉, 개발할 때는 비압축으로 사용, 배포할 때는 압축으로 사용 - j..

li 태그에 있는 목록들을 가져와서 p 태그에 추가하기 코드1) 코드2) [결과]

jquery는 javascript를 배우면서 맛보기 정도로 조금씩 배우는 중이다. 배우고 있는 내용들을 위주로 정리하고 있지만 정확하거나 자세한 내용은 아닐 수 있다.. 1. text(), addClass(), val() 1) text() - text() : 텍스트를 읽어오기 - text("문자") : 텍스트를 추가하기 2) addClass() : 클래스 속성 추가하기 3) val() : 요소의 값을 가져오기 코드예시) p태그의 innerText 입력 : Click Me! 결과) 2. attr(), prop(), next(), prev() - attr(), prop() : 속성 변경 가능한 기능은 동일(차이점은 있는데 jquery 본격적으로 수업 하실 때 알려주실 예정) ex) attr("속성명", "속..

[javascript 사용했던 것들] - var 변수명 : 변수 선언 형식 - 함수 처리할 때는 태그에 함수명(); 이라고 선언 후 script 태그 안에서 함수를 선언 ex) Box1 Remove - 이벤트를 처리하는 방법 2가지 1) 각각의 요소에 on이벤트명 속성에 ="이벤트가 발생할 때 호출되는 함수명(); 2) 태그에 id 속성을 준 뒤에 script 태그 안에서 변수 선언후 변수.onclick으로 처리하기 ex) Lorem ipsum dolor sit amet. - document.getElementsById("아이디명") : 아이디명에 해당하는 요소를 가져오겠다. - document.getElementsByTagName("태그명") : 태그명에 해당하는 모든 태그들을 가져오겠다. - quer..

1. div 태그 설명 1) 웹 페이지의 배치(layout)를 담당하는 태그이다. 2) 블럭 모드이다. 3) 일반적으로 다른 요소들을 담을 수 있는 컨테이너의 종류 중에 하나이다. * 컨테이너 : 다른 요소를 자식으로 가지고 있다. 2. javascript 코딩 맛보기 - js는 대소문자를 구분한다. - document.location="이동할 주소url"; - js 함수 만드는 형식) - var 키워드 : 변수 선언시 사용하는 키워드 3. jQuery 코딩 맛보기 - jquery.js 라이브러리를 설치해야 하는데 다운을 받아서 사용할 수도 있고 Using jQuery with a CDN으로 다운을 받지 않고도 사용 가능하다. 오늘 수업에서는 맛보기 정도라 script 태그를 이용하여 사용하였다. htt..