매일 조금씩 짜 서 자신의 selector 함수 (2) - 주요 사고 와 기본 구 조 를 실현 합 니 다.

1484 단어 selector
(1) 에서 초보적인 의미 분석 을 실시 했다. 요 며칠 동안 반복 되 는 실험 에 따라 주요 알고리즘 절 차 를 잠시 선정 하여 선택 기 를 실현 했다. 다음 과 같다.
입력: 문자열 exprs, ',' 연 결 된 선택 자 ', 형식 은' expr 1, expr 2, expr 3.. ', 예 를 들 어' div. main \ # x, div, [type] '
출력: 선택 문자 조건 에 맞 는 DOM 요소 집합 ret
1. exprs 를 ',' 로 하위 표현 식 으로 구분 합 니 다.
2. 각 하위 표현 식 에 값 을 구하 고,
3. 각 하위 표현 식 의 값 을 ret 에 통합 합 니 다.
4. ret 에 중복 요 소 를 제거 하고,
5. ret 를 출력 합 니 다.
상기 5 개 절 차 는 기본 적 인 사상 을 구성 하고 이 절차 에 따라 대외 호출 인 터 페 이 스 를 정의 한다.
window.XX = window.XX || {};
/*
 *           ,
 *   selectors:CSS   ,   '*'
 *   context:         ,   document
 *    :                  NodeList  
 * */
XX.$ = function(selectors, context) {
	 /*   ,   document*/
	context = context || document;
	if(context.querySelectorAll) {//       ,        ,,
		return context.querySelectorAll(selector);
	}

	 
	var  i, ret = [];
	//   , selectors  , :"expr1, expr2, .. "   [expr1, expr2, ..]      
	selectorArr = selectors.split(',');

	//         
	for( i = 0, len = selectorArr.length; i < len; ++i) {
		ret = ret.concat( XX.selector(selectorArr[i], context));
	}

	return ret;
};

상기 코드 에서 XX. selector 함 수 는 가상 처리 서브 표현 식 의 기능 함수 입 니 다. 선택 기의 주요 실현 은 바로 이 함수, 즉 주요 실현 절차 2 입 니 다.
각 하위 표현 식 에 값 을 구하 십시오.
저 는 XX. selector 함 수 를 하위 선택 기 라 고 부 릅 니 다. 하위 선택 기 는 미래 에 새로운 선택 자 를 쉽게 추가 할 수 있 도록 편리 하 게 확장 할 수 있어 야 합 니 다.
오늘 은 좀 적 게 짰어 요. 하하 ~ 다음 에 계속 짰어 요.

좋은 웹페이지 즐겨찾기