jQuery 표준 및 모범 사례

jQuery 표준 및 모범 사례

---

저는 현재 회사 내 웹 개발자 커뮤니티에 jQuery 사용을 배포하는 일을 담당하고 있습니다. 이 과정의 일부는 과정을 제시하는 것이지만 다른 부분은 표준과 모범 사례를 전달하는 것입니다.

'jQuery 모범 사례'를 Google에 검색하면 검색 결과에서 다음을 찾을 수 있습니다. http://www.smashingmagazine.com/2008/09/16/jquery-examples-and-best-practices/ http://www.artzstudio.com/2009/04/jquery-performance-rules/

이것들은 도움이되었고 나는 그들에 대한 많은 유용한 정보를 빛나게했습니다. 그러나 내가 정말로 관심을 가질만한 것은 경험이 풍부한 jQuery 개발자와 나와 비슷한 위치에있는 사람들의 모범 사례에 대한 팁, 함정, 의견 등이 될 것입니다. 좋은 링크도 감사하겠습니다.

편집하다:

내 페이지에 jQuery 코딩 표준 섹션을 추가했습니다.

http://www.jameswiseman.com/blog/?p=48

---

이 유행하는 주제는 바로 여기 StackOverflow.com에서 찾을 수 있습니다.

피해야 할 jQuery 함정

매우 흥미로운 유용한 팁이 차례로 있습니다.

내 북마크에서 찾은 내용은 다음과 같습니다.

• http://paulirish.com/2011/11-more-things-i-learned-from-the-jquery-source/
• http://jquery.open2space.com/
• http://thetoptenme.wordpress.com/2008/08/19/the-complete-guide-for-jquery-developer-reblog/
• http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx

---

제가 개인적으로 시작한 것은 jQuery 세트에 대한 일종의 Apps 헝가리어 표기법 입니다.$

var someInt = 1;
var $someQueryCollection = $( 'selector' );

내 jQuery 스 니펫이 커짐에 따라 jQuery 세트를 변수로 저장하는 것을 촉진 할뿐만 아니라 실제로 어떤 변수 가 jQuery 세트인지 추적하는 데 도움이되는 것이 매우 중요 합니다.

---

눈에 거슬리지 않는 JavaScript (마크 업 및 동작 분리)

과거에는 클릭 핸들러를 마크 업 안에 넣는 것이 일반적이었습니다. 이제 마크 업 안에 JS 코드를 작성하지 말고 DOM 이벤트를 통해 포함하는 것이 좋습니다.

점진적 향상

사용자가 표준 호환 브라우저를 사용하거나 JavaScript를 활성화하면 더 나은 경험을 얻을 수 있습니다. 웹 사이트 / 웹 애플리케이션은 이전 브라우저가 있거나 JS가 비활성화 된 경우에도 계속 액세스 할 수 있습니다.

브라우저 감지가 아닌 기능 감지

위의 요점을 제쳐두고 JavaScript가 장난감 언어라는 메시지를 전달하는 데 실제로 집중할 것입니다 (사전 관념을 깨는 것). 나는 이런 식으로 생각하고 모든 것이 거기에서 내리막 길을 걷는 개발자를 너무 많이 보았습니다. JS 자체가 매우 강력하더라도 JavaScript가 어떻게 매우 강력한 언어인지, 그리고 JS 라이브러리가 필요한 이유 (브라우저 불일치 때문에)를 설명해야합니다.

행운을 빕니다.

---

jQuery가 작동하는 방식은 하나이고 동일하더라도 JavaScript가 작동하는 방식과 다릅니다. jQuery는 클래스 이름 및 요소 ID와 같은 CSS 선택기에서 작동합니다. jQuery에서 항목을 선택하려면 다음을 수행하십시오.

$("#yourID") or $(".yourClass") or $("div") or $("#yourID p") etc

그리고 기준에 맞는 페이지의 모든 요소 컬렉션을 얻을 수 있습니다. 그런 다음 어떤 종류의 반복도없이 이러한 모든 요소에 대해 작업을 수행 할 수 있습니다. 다음 사항을 기억해야합니다.

$(".yourClass").click(function(){
    //do stuff
});

.yourClass연결된 모든 항목에 영향을 미칩니다 . 한 가지 팁 :에 액세스하려면 $(this)로컬 변수로 저장해야합니다.

$(".yourClass").click(function(){
    var $this = $(this);
});

기능 속도가 빨라지기 때문입니다.

참고 URL : https://stackoverflow.com/questions/1245598/jquery-standards-and-best-practice