>웹 프론트엔드 >JS 튜토리얼 >jquery와 프로토타입 Framework_jquery의 자세한 비교

jquery와 프로토타입 Framework_jquery의 자세한 비교

WBOY
WBOY원래의
2016-05-16 17:13:25855검색

예전에는 jquery를 사용하여 인터페이스를 만들었지만 이제는 Ajax 효과를 많이 사용해야 하므로 레일이 포함된 프로토타입으로 전환했습니다

jquery를 많이 사용하기 때문에 다른 프레임워크와 비슷하겠지만 세부적으로는 차이점이 많습니다. . .

1.dom 로딩:

Jquery에는 dom 트리가 완료될 때까지 js 함수 바인딩을 연기하는 dom 준비 메서드가 있습니다(이 함수가 없으면 일부 요소 이벤트 함수 등의 바인딩이 잘못될 수 있음).

$(document).ready(function(){})

근데 프로토타입이 없어요. . . 비공식 확장 기능을 직접 찾아야 하는데, 이렇게 중요한 기능인 이 기본 기능이 왜 그렇게 오랫동안 핵심 라이브러리에 추가되지 않았는지 모르겠습니다.

2.경로 검색, 돔 위치 지정

JQuery의 DOM 검색은 CSS 위치 지정과 일치하며 사용 후 매우 편리하다는 것이 이 기능의 가장 큰 특징이자 장점 중 하나입니다.

$('.func #select_all').click(function()
$(this).parent('div').parent('div').find('li .checkbox 입력:checkbox' )

프로토타입은 단일 DOM 개체($(id))를 찾는 데만 편리합니다.

더 귀찮은 것은 경로 아래에 많은 객체가 발견되면 개별과 배열을 분리하는 것입니다.

$$('div .right_contact')를 가져오세요. 이 스타일은 여전히 ​​특정 유형의 개체를 배치합니다.

경로 검색을 사용하는 대신 이 측면은 jquery만큼 편리하고 일관성이 없습니다

3. 함수, 이벤트 바인딩
예를 들어 right_contact 클래스를 사용하여 클릭 강조 이벤트를 div에 바인딩합니다.

코드 복사 코드는 다음과 같습니다.

$$('div .right_contact').each(function( item) {
item.observe('click', function(event){
new Effect.Highlight(item,{ 지속 시간: 2.0,startcolor: '#ffff99',endcolor: '#ffffffff',restorecolor: '#ffffff' });
})

jquery라면 훨씬 간단합니다.

$('.right_contact').click(function(){ 

$(this).toggleClass('hilight');
})

저는 많은 프레임워크를 사용해 보았지만 가장 인상적인 것은 hge 게임 엔진이라는 프레임워크입니다. 이 프레임워크는 많은 기본 세부 사항과 구현 방법을 캡슐화하고 있습니다. 그런 다음 그는 간단한 퍼즐부터 고급 다층 플랫폼 게임까지 모든 것을 만들 수 있다고 말했습니다. 게임 로직이 아닌 코드는 전혀 생각하지 않고 전략을 세우세요

훌륭한 프레임워크는 디자인 패턴 측면에서 프로토타입보다 비즈니스 로직에 초점을 맞춰야 합니다. 가장 일반적인 예는 마우스 클릭으로 기능을 실행하려면 프로토타입이 커야 한다는 것입니다. 그리고 포괄적인 관찰 방법을 사용하고 클릭 이벤트

를 등록하고 jquery에는 item.click 기능이 있습니다. . . Observe는 모든 것을 포괄하지만 가장 일반적으로 사용되는 이벤트에 대한 전용 기능을 만드는 jquery의 관행을 통해 사람들은 비즈니스 논리에 더 집중할 수 있습니다. . .

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.