Einfaches JavaScript zum Nachahmen von jQuery-Verhalten bei der Verwendung dieses in Ereignishandlern

Question

Dies ist keine Frage über jQuery, sondern darüber, wie jQuery ein solches Verhalten implementiert.

In jQuery können Sie dies tun:

$('#some_link_id').click(function() 
{ 
    alert(this.tagName); //displays 'A' 
}) 

jemand im Allgemeinen (keine Notwendigkeit, Sie Code zu schreiben) erklären konnte, wie sie das Ereignis des Anrufers html elments passieren (einen Link in diesem speziellen Beispiel tun erhalten) in die diese schlüsselwort?

Ich habe offensichtlich versucht, 1. in jQuery Code aussehen, aber ich konnte eine Zeile nicht verstehen.

Danke!

UPDATE: nach Anurag Antwort habe ich beschlossen, an dieser Stelle einige Code zu schreiben, weil es einfacher zu Code scheint als das, was ich dachte:

function AddEvent(html_element, event_name, event_function) 
{  
    if(html_element.attachEvent) //IE 
     html_element.attachEvent("on" + event_name, function() {event_function.call(html_element);}); 
    else if(html_element.addEventListener) //FF 
     html_element.addEventListener(event_name, event_function, false); //don't need the 'call' trick because in FF everything already works in the right way   
} 

und dann jetzt mit einem einfachen Anruf wir jQuery nachahmen Verhalten dieser Handler in Veranstaltungen mit

AddEvent(document.getElementById('some_id'), 'click', function() 
{    
    alert(this.tagName); //shows 'A', and it's cross browser: works both IE and FF 
}); 

glauben Sie, dass es irgendwelche Fehler oder etwas, das ich das alles, was in einem zu sup missverstanden Einnahme früherer Weg ???

Answer 1

In Javascript, können Sie eine Funktion programmatisch nennen und ihm sagen, welche this finden sollte und ihm einige Argumente übergeben entweder mit der call oder apply Methode in Function. Funktion ist auch ein Objekt in Javascript.

jQuery durchläuft jedes übereinstimmende Element in seinen Ergebnissen und ruft die click-Funktion für dieses Objekt auf (in Ihrem Beispiel), wobei das Element selbst als Kontext übergeben wird oder auf diese Funktion innerhalb this verweist.

Zum Beispiel:

function alertElementText() { 
    alert(this.text()); 
} 

Dadurch wird die Text-Funktion auf dem Kontext nennen (dieses) Objekt und alarmiert es Wert ist. Jetzt können wir die Funktion aufrufen und den Kontext machen (diese) zu sein, das jQuery Element gewickelt (so können wir this direkt aufrufen, ohne $(this) zu verwenden.

<a id="someA">some text</a> 
alertElementText.call($("#someA")); // should alert "some text" 

Die Unterscheidung zwischen call oder apply mit der Funktion aufzurufen ist subtil übergeben. mit call werden die Argumente, wie sie sind, und mit apply werden sie als Array übergeben werden. Informieren sie sich mehr über apply und call auf MDC.

Ebenso, wenn ein DOM Event-Handler aufgerufen wird, weist this bereits das Element Das hat das Ereignis ausgelöst. jQuery ruft nur Ihren Callback auf und legt den Kontext für das Element fest.