jQuery4 자손 선택자, 후손 선택자 body 구성 Apple Bag Cat Dog Hello 전체적인 문서 객체를 모델에 나타내면 위처럼 나타낼 수 있다. body태그를 기준으로 body 태그 바로 아래 있는 div 태그가 자손이며, body 태그의 아래에 있는 모든 문서 객체를 후손이라고 한다. 자손 선택자 자손 선택자를 선택하는 선택자이며 '요소A > 요소B'의 형태로 사용한다. 위 코드처럼 body 태그의 자식으로 범위를 한정해 전체가 선택된다. ( div에만 style="color: red" 가 적용된다. ) 후손 선택자 후손 선택자는 이름 그대로 후손을 선택하는 선택자이다. '요소A 요소B'의 형태로 사용하며, 요소A의 후손으로 범위를 한정한다. ( body 태그의 아래에 있는 모든 후손들에게 스타일이 적용된다. div, ul, .. 2020. 5. 9. 태그 선택자 태그 선택자 : 특정한 태그를 선택하는 선택자이다. 태그 선택자는 태그의 이름을 그냥 사용한다. 태그 선택자 Hello World 안녕하세요 헬로월드에 오신것을 환영합니다. 이렇게하면 h1 태그에만 스타일이 적용된다. 여러 개의 태그 선택 2020. 5. 2. 전체 선택자 jQuery 메서드의 가장 기본적인 형태 $('hi').css('color', 'red'); $ : $ hi : 선택자 css('color', 'red') : 메서드 선택자는 jQuery에서 가장 중요한 역할을 한다. 전체 선택자 Hello World css() 메서드는 jQuery의 가장 기본적인 메서드로, 첫 번째 매개변수에 바꾸고자 하는 스타일 속성 이름을 입력하고, 두 번째 메서드에 스타일 속성 값을 입력한다. 위 코드는 HTML 페이지에 존재하는 모든 문서 객체의 color style 속성에 red를 입력한다. 2020. 4. 30. $(document).ready() $(document).ready() jQuery를 사용한 모든 웹 페이지는 위와 같은 코드로 시작된다. $(document).ready()는 문서가 준비되면 매개변수로 넣은 콜백 함수를 실행하라는 의미이다. window 객체의 load 이벤트 연결 고전 이벤트 모델은 한 번에 하나의 이벤트만 연결할 수 있다. 반면에 jQuery의 이벤트 메서드는 표준 이벤트 모델이나 인터넷 익스플로러 이벤트 모델과 마찬가지로 이벤트로 여러 개의 함수를 연결할 수 있다. 복수의 이벤트 연결 위 코드를 실행하면 문서가 준비되는 순간 경고창 세 개가 연달아 표시된다. 간단한 형식의 $(document).ready() $(document)ready() 메서드는 많이 사용되므로 위와 같이 간단하게 사용할 수 있는 형태를 제공한다.. 2020. 4. 29. 이전 1 다음