jQuery Sizzle – What and how to use Sizzle?

Sizzle은 jQuery 라이브러리에서 사용되는 크로스 브라우저 Javascript DOM 선택기 엔진입니다 (실제로 jQuery 프로젝트에서 스핀 오프 됨) $ ( '# someid')와 같은 jQuery를 선택하면 jQuery가 Sizzle을 트리거하여 DOM select를 실행 한 다음 그 결과를 jQuery로 다시 리턴한다

따라서 jQuery 선택기를 사용하려고하지만 다른 많은 기능을 사용하지 않는 경우 독립형 Sizzle을 사용하면 jQuery의 불필요한 오버 헤드를 줄일 수 있습니다 또한, sizzle의 js 크기는 jQuery보다 훨씬 작습니다 GitHub의 현재 Sizzle 릴리스를 살펴 보겠습니다

지글 지글 크기는 약 18KB, jQuery 214 (5 배 더 큼)의 약 90KB와 비교됩니다 따라서 지즐을 사용하면 페이지로드 시간이 단축됩니다 지글 지글 대는 CSS 선택기 구문을 사용하고 jQuery와 매우 유사합니다

W3school CSS 선택자 페이지를 참조 할 수 있습니다 다음으로, 우리는 Sizzle을 사용하는 방법을 보여줄 것입니다 여기에 테스트 할 준비가 된 HTML 요소가 있습니다 지즐을 사용하려면 js 파일을 페이지에 포함하기 만하면됩니다

sizzlejs는 GitHub에 있기 때문에 jsfiddle에 파일을 포함 시키려면 CDN을 사용해야합니다 RawGit을 사용할 것입니다 (아래 비디오 설명의 링크 참조) 자, 이제 준비 됐어 이드가 첫 번째 div를 선택하겠습니다

JQuery의 $ ( 'selector')에 simliar를 사용하여 Sizzle ( 'selector')를 사용할 수 있습니다 그래서 그것은 지즐 ( '# testdiv')이 될 것입니다 우리가 그 결과를 볼 수 있도록 팝업에 div 텍스트를 넣자 반환 된 결과는 항상 배열에 있으므로 인덱스를 지정해야합니다 끝난! jQuery와 작동하는 모든 선택기 역시 Sizzle과 함께 사용해야합니다

이번에는 클래스별로 선택해 봅시다 또는 사용자 지정 특성 또는 이와 비슷한 것 : last-child selector 요약하면, Sizzle은 jQuery의 일부입니다 선택기 만 사용하려는 경우 시즐을 사용하거나 성능 /로드 시간이 가장 중요합니다 그렇지 않으면 jQuery로 이동하십시오 시청 해주셔서 감사합니다! 더 많은 팁 / 튜토리얼을 구독하십시오!