javascript 10 가장 일반적으로 사용되는 사용자 정의 함수 [권장]_javascript 기술

function addEvent( elm, evType , fn, useCapture) {
if (elm.addEventListener) {
elm.addEventListener(evType, fn, useCapture);//DOM2.0
return true; >else if (elm.attachEvent) {
var r = elm.attachEvent('on' evType, fn);//IE5
return r
}
else {
elm[ 'on' evType] = fn;//DOM 0
}
}

// with Tino Zijdel의 입력
// http://dean.edwards.name/weblog/2005/10/add-event/
function addEvent(element, type, handler) {
//고유한 디스패치 각 이벤트 ID에 대한 이벤트 핸들러
if (!handler.$$guid) handler.$$guid = addEvent.guid
//요소의 이벤트 유형에 대한 해시 테이블 생성
if (! element.events) element.events = {};//각 "요소/이벤트" 쌍에 ​​대한 이벤트 핸들러의 해시 테이블을 생성합니다.
var handlers = element.events[type]
if (! handlers) {
handlers = element.events[type] = {};
//기존 이벤트 핸들러 저장(있는 경우)
if (element["on" type]) {
handlers[ 0 ] = element["on" type];
}
}
//해시 테이블에 이벤트 핸들러 함수 저장
handlers[handler.$$guid] = handler; / /모든 작업을 수행하기 위한 전역 이벤트 핸들러 할당
element["on" type] = handlerEvent
//고유 ID를 생성하는 데 사용되는 카운터
addEvent.guid = 1;
function RemoveEvent(element, type, handler) {
//해시 테이블에서 이벤트 핸들러 함수 제거
if (element.events && element.events[type]) {
delete element.events[ type][handler.$$guid];
}
};
function handlerEvent(event) {
var returnValue = true
//이벤트 객체 캡처(IE는 전역 이벤트를 사용함) object)
event = event || fixEvent(window.event);
//이벤트 처리 함수의 해시 테이블에 대한 참조 가져오기
var handlers = this.events[event.type] ; 🎜>//각 핸들러 함수 실행
for (var i in handlers) {
this.$$handleEvent = handlers[i]
if (this.$$handleEvent(event) = == false ) {
returnValue = false;
}
}
return returnValue;
}
//IE의 이벤트 객체에 "누락된" 함수 추가
function fixEvent(event ) {
//표준 W3C 메서드 추가
event.preventDefault = fixEvent.preventDefault;
event.stopPropagation = fixEvent.stopPropagation;
fixEvent.preventDefault; = function() {
this.returnValue = false;
};
fixEvent.stopPropagation = function() {
this.cancelBubble =


이 기능은 매우 강력하며 IE의 이 포인팅 문제를 해결합니다. 이벤트는 항상 첫 번째 매개변수로 전달되므로 브라우저 간 문제가 없습니다.

또한 HTML5 작업 그룹 버전도 소중하게 생각합니다.

}


(8) getElementsByClass()
저는 수집하는 습관이 있고 많은 버전을 가지고 있는데, 마침내 스스로 브레인스토밍하고 구현했습니다. 다음은 내 구현입니다.

별칭은 Dean Edwards가 처음 구현한 getElementsBySeletor입니다. Prototype.js, JQuery 및 기타 클래스 라이브러리에는 해당 구현이 있습니다. 그 중 JQuery는 이를 $() 선택기에 통합했으며 그 명성은 이전 버전보다 뛰어납니다. 그러나 IE8과 같은 최신 브라우저는 이미 querySelector 및 querySelectorAll 메소드를 구현했습니다. IE6 및 IE7이 폐기되면 쓸모가 없게 됩니다. Wuyou는 구현 원칙에 대해 설명했습니다. 너무 길어서 내용이 잘 안 나오네요. 자세한 내용은 원저자 홈페이지에서 확인하시면 됩니다. (6) 토글()

은 DOM 요소를 표시하거나 숨기는 데 사용됩니다.

var el = document.getElementById(obj);
DOM은 insertBefore만 제공합니다. 우리에게 꼭 필요한 insertAfter를 직접 구현해 보세요. 하지만 이제 Firefox를 제외한 모든 브라우저에서는 insertAdjacentElement가 더 나은 선택이라고 생각합니다. Jeremy Keith 버전은 다음과 같습니다.

parent.insertBefore(node, referenceNode.nextSibling)
은 판단에 사용됩니다. 배열에 특정 값이 있는지 확인합니다. 다음 메서드는 Prototype 클래스 라이브러리에서 가져옵니다.

for (var i=0,l = this.length ; i if (this[i] === value) {
return true; }
}
return false;
};


다른 버전: