23.02.21 (선택자)

😀구를 JQuery.com -> donwload -> Download the uncompressed, development jQuery 3.6.3 -> 오른쪽버튼 다른이름으로 저장 -> 이클립스에서 저장 -> javascrpt src로 연동

 

😀라이브러리(library)는 다른 프로그램들과 링크되기 위하여 존재하는, 하나 이상의 서브루틴(subroutine)이나 함수(function)들의 집합 파일

 

😀

 

 

/*  
제이쿼리(JQuery)?
- 제이쿼리는 웹 사이트에 자바스크립트를 쉽게 활용할 수 있도록 도와 주는 오픈 소스 기반의 자바스크립트 라이브러리임.

제이쿼리의 특징
- 웹 사이트 상에서 요소를 쉽게 찾고 조작할 수 있음
- 거의 모든 웹 브라우저에 대응할 정도로 호환성이 좋음
- 애니메이션 등 다양한 기능을 제공함
- 유지관리가 용이한 짧은 코드 작성을 지원함
- 오픈소스여서 쉽게 접근이 가능함

제이쿼리 사용 방법
- 라이브러리 파일을 다운받아서 사용하는 방법
- CDN(Content Delivery Network)을 이용하여 사용하는 방법
*/

 

/*
제이쿼린 진입(실행) 방법 4가지
1. JQuery(document).ready(function() {
코드작성
});

2. JQuery(function() {
코드작성
});

3. $(document).ready(function() {
코드작성
}); ==> 표준으로 많이 사용하는 코드

4. $(function() {
코드작성
});
*/

// 문서의 body부분을 읽고 JQuery를 실행하라는 의미
// JQuery 동작 방법
// 형식) $("선택자").동작함수("속성", "값");

$(() => {
	$("h2").css("color", "red");
});

 

 

/*
제이쿼리 선택자 사용 방법
1. 직접 선택자
- 전체 선택자 : $("*")
  ==> 모든 요소(태그)를 선택하는 선택자
  
- 아이디 선택자 : $("#아이디 이름")
  ==> id 속성에 지정된 이름을 가진 요소를 선택하는 선택자
  
- 클래스 선택자 : $(".클래스이름")
  ==> class 속성에 지정된 이름을 가진 요소를 선택하는 선택자
  
- 요소(태그) 선택자 : $("요소(태그)명")
  ==> 지정된 요소(태그)명과 일치하는 요소를 선택하는 선택자
  
- 그룹선택자 : $("선택1, 선택2, ... 선택n")
  ==> 선택1, 선택2, ... 선택n에 지정된 요소를 한꺼번에 선택하는 선택자
*/

$(() => {
$("*").css("color", "blue");
}); 

 

😀부모, 자식(자손), 형제 선택자

$(function() {
	$(".content").parent()
    				.css(~
    $("title li").css(~
    
    $("title > li").css(~
    
    $(".content").children()
    				.css(~
    $(".content").prev()
    				.css(~
    $(".content").next()
    				.css(~
    $(".content").prevAll()
    				.css(~
    $(".content").nextAll()
     				.css(~
    $(".content").siblings()
    				.css(~
});