Programming/jQuery (4) 썸네일형 리스트형 DAY 102. jQuery - 객체 조작(객체 생성 및 제거, 배열) 객체 생성 및 제거 문서 객체 생성 html 태그 : 직접 html 구문을 문자열로 작성한다. jQuery 방식 : jQuery 객체 이용 구문 작성한다. DOM 방식 document.createElement('태그명').innerHTML('텍스트노드내용'); document.createElement("태그명").setAttribute('속성명','속성값'); jQuery 객체 생성 ▪️ html 내부에 생성한 요소 추가 // 01. 요소명을 기준으로 생성구문을 자식으로 추가시킨다. $(요소명).append(생성구문) $(요소명).append(function([n],[html]){}) // 요소명의 자식 요소로 생성구문을 "뒷부분"에 추가한다. $(요소명).prepend(생성구문) $(요소명).prepe.. DAY 96. jQuery - 객체 조작(클래스/속성 설정) 객체 조작 content 설정 ▪️ html() 선택된 요소의 content 영역(innerHTML/텍스트노드)을 리턴하고 설정하는 메소드이다. html 태그를 태그로 인식한다. 리턴 시 첫 번째 요소 텍스트 노드를 리턴한다. 전체 요소 리턴 시에는 함수를 사용한다. // 선택된 요소의 첫 번재 텍스트 노드를 리턴 $('요소명').html(); // 선택된 요소의 text 노드 내용 대입 $('요소명').html('텍스트 노드 내용'); $('요소명').html(function(index, 현재 값){}); ▪️ text() 선택된 요소의 content 영역(innerHTML/텍스트노드)을 리턴하고 설정하는 메소드이다. html 태그를 태그로 인식할 수 없다. 리턴 시 전체 요소 텍스트 노드를 리턴한다... DAY 95. jQuery - 객체 탐색 메소드 객체 탐색 순회(탐색) 메소드(Traversing) filtering 메소드 선택자로 지정한 객체를 기준으로 객체 그룹에서 위치를 가지고 객체를 선택하는 메소드 Ancestors 메소드 선택된 요소의 상위 요소들을 선택할 수 있는 메소드 Descendants 메소드 선택된 요소의 하위 요소들을 선택할 수 있는 메소드 Sideways 메소드 같은 레벨에 있는 요소(형제)를 선택할 수 있는 메소드 요소가 있는지 찾는 메소드 선택자로 지정된 범위에 특정한 요소가 존재하는지 찾을 때 사용한다. // 선택된 요소의 범위 내에 인자와 동일한 요소가 있는지 찾아서 있으면 true, 없으면 false 리턴 $('요소명').is(인자) DAY 94. jQuery - 연결 방법, 시작 방법 jQuery 존 레식에 의해 개발된 경량 JavaScript 라이브러리이다. 특히 DOM과 관련된 처리, 일관된 이벤트 연결, 시각적 효과, Ajax 애플리케이션 관련 복잡했던 코드를 보다 쉽게 구현했다. 그 외에도 jQuery 플러그인을 통해 차트 작성, 슬라이드 쇼, 엑셀 같은 테이블도 간단히 구현이 가능하다. 연결 방법 1. CDN(Content Delivery Network)을 통한 연결 온라인으로 js파일을 불러와서 실행한다. 라이브러리를 제공하는 사이트의 주소를 이용하여 파일 경로를 지정하는 방법 네트워크 상의 문제, CDN 서버의 문제 발생할 경우 자바스크립트 화면을 불러와서 활용할 수 없다. 2. 파일 다운로드 연결(오프라인에서 사용하는 경우) jQuery 홈페이지에서 최신 버전 js 파일.. 이전 1 다음
