[daily study] DOM_제어 대상을 찾기(jQuery)

*본 글은 생활코딩 강의를 듣고 복습을 위해 작성되었습니다.



1. jquery의 기본문법

$('li').css('color','red');

👉 위의 코드가 jqeury의 기본적인 문법 형식이다.


🧡 $()는 jquery의 함수이다.

💛 .css()는 함수의 인자로 다양한 종류가 있다.





2. jquery의 기본문법

<!DOCTYPE html>
<html>
<body>
<ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
</ul>
<ol>
    <li>HTML</li>
    <li class="active">CSS</li>
    <li>JavaScript</li>
</ol>
 
<script>
    //DOM으로 작성했을 때
    var lis = document.querySelectorAll('li');
    for(var i = 0; i < lis.length; i++){
        lis[i].style.color = 'blue';
    }
    
    //jquery로 작성했을때
    $(document).ready(function(){
       $('li').css('color','blue'); 
    });
</script>
</body>
</html>

👉 DOM과 jquery를 비교해보면 jquery쪽이 알아보기 쉽고 내용이 간단한 것을 알 수 있다.




*본 글은 생활코딩 제어대상찾기(jQuery)에서 이론적인 부분을 가져왔음을 밝힙니다.

출처 : https://opentutorials.org/course/1375/6658

좋은 웹페이지 즐겨찾기