JQuery 중요개념

1. val() / text(), html() 차이
   
   • val() - HTML 폼 요소의 value 속성 값을 지정하고 가져옴
     • val()는 무조건 "form!!"에 있는 값 받아올 때 사용, 입력할 때도 사용★★★
     • 그리고 checkbox와 radio button, <select> 요소의 선택 상태도 가져오거나 지정할 수 있음
   • val(value) - form elements에 값을 지정함
     • $('input').val('helloworld);      //input의 value 값에 helloworld라고 넣음
   • text(), html() - 요소의 일반 텍스트나 HTML 내용을 조회하고 지정함
     • 전달인자 없이 html() 메서드를 실행하면 일치하는 요소의 첫 번째 요소안의 HTML내용을 반환함
   • text(value), html(value) - textString 또는 함수(function(index, text) 이런 형태)로 넣을 수 있음
     • 이 역시, Set하기 위해 쓰인다.
2. 선택자
   • h2태그의 아이디값이 target인 선택자를 지정 -> $('h2#target')
   • p태그의 클래스 속성값이 ssafy인 선택자를 지정 -> $('p.ssafy')  or  $('.ssafy')
   • div의 직계자식인 div태그와 span태그를 동시에 선택자로 지정(> : 직계자식) -> $('div>div,span')
   • div의 후손인 p태그를 선택자로 지정(띄어쓰기 : 후손) -> $('div p')
3. this, item : 이벤트에서 정의되는 자기자신을 가르키는 것 
   • this 사용법
     • $('h1').each(function(index) {
       • $(this).addClass('high_light_'+index);
     • }); 
   • item 사용법
     • $('h1').each(function(item) {
       • $(item).addClass('high_light_'+index);
     • });
4. setTimeout, setInterval
   • setTimeout : 일정시간"후" 함수를 호출!
     • 3초 후에 첫번째 이미지가 body태그 뒤에 붙는 코드
     • setTimeout(function() {
       • $('body').append($('img:first'));
     • }, 3000);
   • setInterval : 일정시간"마다" 함수를 호출!
     • 2초 간격으로 계속 첫번째 이미지가 마지막에 붙음
     • setInterval(function() {
       • $('body').append($('img:eq(0)'));
     • }, 2000);
5. append, appendTo
   • append : 태그에 내용이 붙을 때 사용. 나(객체)에 무엇(자료)를 append하는것
     • $('body').append($('img:eq(0)'));
   • appendTo : 내용에 태그가 붙을 때 사용. 나(자료)를 어떤것(객체)에 append하는 것
     • $('img').first().appendTo('body');