21.01.05

1. J-Query

- j-qurey는 자바스크립트의 라이브러리이다.
- 라이브러리는 자주 사용하거나, 직접 구현이 어려운 기능을 만들어 모아놓은 프로그램 그룹이다.
- 자바스크립트의 라이브러리로는 j-query외에도 RecuireJS,Prototype등이 있다.
- 사용하는 이유 :
	1. 사용의 편리성이 있다.( 코드가 줄어 듦 )
	2. Cross Browsing
		- 자바스크립트는 브라우저에서 해석하므로 종류나 버전마다 표현이 안되거나 다르게 되는경우가 있다.
		- j-query에서는 내부적으로 브라우저마다 처리를 해 놓았기 때문에 신경쓸 필요가 없다.
		- 최종적으로는 자바스크립트랑 J-QUERY를 혼합해서 쓴다.
	3. 다양한 Plugin( 웹 브라우저의 일부로서 쉽게 설치되고 사용될 수 있는 프로그램 )
		- j-query를 기초로 한 유용한 Plugin이 많다.
		- Bootstrap , J-query UI , Pagination 등
- j-query 불러 오는 법( https://code.jquery.com/ )- -

$(document).ready(function(){
	//J-query..
    //JS 프로그래밍..
});

- 스크립트가 위에 있던 시절에 헤드에 들어갔기 때문에 문서를 다읽고나면 제이쿼리나 자바스크립트를 돌려라
- 레거시

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

- <head>에 <script>를 넣어 연결시킬 주소를 가져오는 방법이다.
- j-query를 직접 다운받는 방법도 있다.

1. Selector

 console.log($('#one'));//one이라는 아이디 가져오기
 console.log($('.cls'));//cls라는 클래스 가져오기
 console.log($('p'));//p태그 가져오기

 console.log($('*'));//모든 요소(실제로 쓰진않음)
 console.log($('h2.cls'));//h2태그 중에서 cls라는 클래스
 console.log($('p:first'));//p태그 중에서 첫번째

- $('#one) : 아이디가 one인 요소
- $('.cls') : 클래스가 cls인 요소
- $('p') : 태그가 p인 요소
- $('*') : 모든 요소 ( 실제로는 쓰진 않음 )
- $('h2.cls) : h2태그 중에서 클래스가 cls인 요소
- $('p:first') : p태그 중에서 첫번째 요소

//잘 쓰이진 않지만 차이점을 확인 해볼 것
console.log($('ul>li:first'));//첫번째 ul의 자식중 첫번째li
console.log($('ul>li:first-child'));//모든 ul의의 자식중 첫번째 li
//input[type='text'] , a[target = '_blank']
console.log($('a','a[href]'));//a의 href속성이 있는 요소
console.log($('a','a[target="_blank"]')); //a의 target이 _blank인 요소
console.log($('a','a[target!="_blank"]'));//a의 target이 _black가 아닌요소

- $('ul>li:first') : 첫번째 ul태그 하위의 첫번째 li 요소
- $('ul>li:first-child') : 모든 ul태그 하위의 첫번째 li 요소
- $('a','a[href]'));//a의 href속성이 있는 요소
- $('a','a[target="_blank"]') :a의 target이 _blank인 요소
- $(':button') : 버튼태그 또는 속성인 요소

console.log($('tr:odd'));//odd:홀수(1,3,5)
console.log($('tr:even'));//even:짝수(0,2,4)

- $('tr:odd) : <tr>이 홀수인 요소
- $('tr:even) : <tr>이 짝수인 요소
- $('tr:odd').css({'background-color' : 'lightgray'}); : 제이쿼리로  요소를 불러와서 css변경

Author And Source

이 문제에 관하여(21.01.05), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@mingmang17/21.01.05-qpjal43e

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

21.01.05

1. J-Query

Author And Source

좋은 웹페이지 즐겨찾기