JavaScript / jQuery DOM 선택기

jQuery vs JavaScript

jQuery는 2006년 John Resig에 의해 만들어졌습니다. 브라우저 불일치를 처리하고 HTML DOM操作, 이벤트 처리, 애니메이션 및 AJAX를 간소화하기 위해 목표를 설정했습니다。

10여 년 동안 jQuery는 세계에서 가장 인기 있는 JavaScript 라이브러리였습니다。

그러나 JavaScript Version 5（2009）이후로는 대부분의 jQuery 기능이 표준 JavaScript로 해결할 수 있습니다：

HTML 요소를 id로 찾기

id="intro"의 요소를 반환합니다：

jQuery

var myElement = $("#id01");

직접 시험해 보세요

JavaScript

var myElement = document.getElementById("id01");

직접 시험해 보세요

HTML 요소를 태그 이름으로 찾기

모든 <p> 요소를 반환합니다：

jQuery

var myElements = $("p");

직접 시험해 보세요

예제

var myElements = document.getElementsByTagName("p");

직접 시험해 보세요

클래스 이름을 통해 HTML 요소를 찾아보세요

class="intro"를 가진 모든 요소를 반환합니다.

jQuery

var myElements = $(".intro");

직접 시험해 보세요

JavaScript

var myElements = document.getElementsByClassName("intro");

직접 시험해 보세요

요소를 찾는 것은 Internet Explorer 8 및 이전 버전에서 동작하지 않습니다.

CSS 선택자를 통해 HTML 요소를 찾아보세요

class="intro"를 가진 모든 <p> 요소의 목록을 반환합니다.

jQuery

var myElements = $("p.intro");

직접 시험해 보세요

JavaScript

var myElements = document.querySelectorAll("p.intro");

직접 시험해 보세요

querySelectorAll() 메서드는 Internet Explorer 8 및 이전 버전에서 동작하지 않습니다.