qvab,
скрипт:
(function(){
var doc = document, data = {}, docEl = doc.documentElement;
// главная функция.
function addHandler(evt, selector, handler) {
if (!data[evt]) { // первый запуск для этого типа событий
data[evt] = {};
// надо установить обработчик
// ставим его на документ. так же делает live у jquery.
if (doc.addEventListener) {
doc.addEventListener(evt, universal, false);
} else if (doc.attachEvent) {
doc.attachEvent("on" + evt, universal);
} else {
// тут выпендриваемся со свойствами. но оно уже не нужно.
}
}
if (!data[evt][selector]) {
data[evt][selector] = [];
}
data[evt][selector].push(handler);
}
// этот обработчик будет расфасовывать поступающие сообщения.
function universal(e) {
var selector, i;
// фикс ивента для IE
e = fixEvent(e || window.event);
*!*
if (e.type in data) {// тут может быть баг в IE. у меня под рукой его нет.
*/!*
for (selector in data[e.type]) { // обходим все селекторы
if (matches(e.target, selector)) {// и находим тот, под который попадает элемент
for(i = 0; i < data[e.type][selector].length; i += 1) { // и исполняем массив обработчиков.
data[e.type][selector][i].call(e.target, e);
}
}
}
}
}
// тут добавляются w3c фишки для IE
function fixEvent(e) {
if (!e.target) {
e.target = e.srcElement;
}
return e;
}
// тут проверяется соответствие элемнта селектору
function matchesSel(selector) {
// исп. this для поддержки нативных методов.
return selector === "*" || this.tagName.toLowerCase() === selector.toLowerCase();
}
// если есть нативные реализации проверки соотв. селектору, то исп. их.
matchesSel = docEl.matchesSelector || docEl.mozMatchesSelector || docEl.webkitMatchesSelector || docEl.oMatchesSelector || docEl.msMatchesSelector || matchesSel;
// оборачиваем.
var matches = function(element, selector){
return matchesSel.call(element, selector);
};
window["addHandler"] = addHandler;
})();
пример:
<!DOCTYPE html>
<html>
<head>
<script>
(function(){function h(a){var c,d,a=a||window.event;a.target||(a.target=a.srcElement);if(a.type in b)for(c in b[a.type])if(g.call(a.target,c))for(d=0;d<b[a.type][c].length;d+=1)b[a.type][c][d].call(a.target,a)}function g(a){return"*"===a||this.tagName.toLowerCase()===a.toLowerCase()}var f=document,b={},e=document.documentElement,g=e.matchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||e.a||e.msMatchesSelector||g;window.addHandler=function(a,c,d){b[a]||(b[a]={},f.addEventListener?f.addEventListener(a,
h,!1):f.attachEvent&&f.attachEvent("on"+a,h));b[a][c]||(b[a][c]=[]);b[a][c].push(d)}})();</script>
<!-- ДО ЗАГРУЗКИ ДЕРЕВА! -->
<script>
addHandler("click", "div", function(){alert("клик по диву");});
addHandler("click", "*", function(){alert("клик по документу");});
addHandler("click", "span", function(){alert("клик по спану");});
</script>
</head>
<body>
<h1>Кликни на них!</h1>
<div>Я див!</div><br><span>Я span</span>
</body>
</html>