IT world

jQuery 소개 본문

코딩/JQuery

jQuery 소개

엄킹 2019. 8. 6. 16:57

JQuery 란



- 엘리먼트를 선택하는 강력한 방법과 선택된 엘리먼트들을 효율적으로 제어할 수 있는 다양한 수단을 제공하는 자바스크립트 라이브러리이다.


- 자바스크립트는 결국에 html의 엘리먼트들을 제어하는 것이 역할이고 제어하고자 하는 엘리먼트들을 선택해야하는데 이러한 선택을 하기 쉽도록 기능을 제공하는 것이 jquery의 역할이다.

 



 

첫번째 - Hello world




- srcipt 태그 중 src 속성이 나오는데 해당 속성에 적혀있는 url이 jquery 로직이 담겨져 있는 url이다. 

  (현재 구글에서 지원해주는 서비스를 사용 중이다.)



JQuery 문법


$(제어대상).method1().method2()...;


-기본적으로 jqurey는 자신만의 문법을 가지고 있으며 $(제어대상)은 주어에 해당하고 메소드는 서술어에 해당한다.


-제이쿼리는 $로 시작하며 jQuery로 변경하여 사용할 수 있지만 편의상 $를 사용한다.


-제어대상으로 들어오는 텍스트는 CSS 셀렉터 문법이 들어온다. 현재 제어대상으로 .welcome을 제어한다고 작성하였는데 '.'는 welcome이   

 라는 class를 찾아내서 해당 엘리먼트들에게 css효과를 한번에 제공하겠다는 의미이다.


"$('.welcome')을 통해 welcome이라는 class를 사용하는 엘리먼트들을 가져온다는 의미이다."


-.html이라는 메소드를 사용해서 welcome이라는 class들에게 해당 텍스트를 제공하고 화면에 표시된다. (위 코드는 모든 welcome class를 사

 용한 엘리먼트들에게 적용된다.)


-css라는 메소드를 통해서 첫번 째 인자와 두번 째 인자를 통해 welcome class에 css속성을 부여한다. 즉 배경화면의 색을 yellow로 변경한다.


-여기서 중요한 특징은 제이쿼리가 제공하는 모든 메소드들은 메소드가 return될 때 그 메소드가 제어했던 대상을 return하기 때문에 해당 

 메소드가 종료되는 지점에 '.'을 사용하여 여러 개 이어 쓸 수 있다는 점이다. => "이러한 특징을 체인이라고 부른다."







[결과]


-결과를 통해 확인해본 결과 welcome class에 배경색은 yellow와 텍스트가 작성된 것을 확인 할 수 있다.




-참고 : https://www.youtube.com/watch?v=EQ48ZpnN3ug&list=PLrCCNh6y7w2g6U7RX_v-TOefyRPiO32jT

'코딩 > JQuery' 카테고리의 다른 글

ajax  (0) 2019.08.08
JQuery event  (0) 2019.08.06
JQuery chain  (0) 2019.08.06
JQuery wrapper  (0) 2019.08.06
Comments