javascript länge - Wie kopiert man einen DOM-Knoten mit Event-Listenern?




für meta (2)

Ich habe es versucht

node.cloneNode(true); // deep copy

Es scheint nicht die Ereignislistener zu kopieren, die ich mit node.addEventListener("click", someFunc); hinzugefügt node.addEventListener("click", someFunc); .

Wir verwenden die Dojo-Bibliothek.


Answers

cloneNode() kopiert keine Ereignislistener. In der Tat gibt es keine Möglichkeit, Ereignis-Listener über das DOM zu erhalten, sobald sie hinzugefügt wurden. Ihre Optionen sind also:

  • Fügen Sie alle Ereignislistener manuell zu Ihrem geklonten Knoten hinzu
  • Refactorieren Sie Ihren Code so, dass die Ereignisdelegierung verwendet wird, damit alle Ereignishandler einem Knoten zugeordnet werden, der sowohl das Original als auch den Klon enthält
  • Verwenden Sie eine Wrapper-Funktion um Node.addEventListener() , um die zu jedem Knoten hinzugefügten Listener zu verfolgen. Auf diese Weise kann die Methode clone() jQuery zum Beispiel einen Knoten mit seinen Ereignislistenern kopieren.

Ein Verschluss ähnelt einem Objekt. Es wird instanziiert, wenn Sie eine Funktion aufrufen.

Der Gültigkeitsbereich eines Abschlusses in JavaScript ist lexikalisch. Dies bedeutet, dass alles, was in der Funktion enthalten ist, zu der der Abschluss gehört, Zugriff auf alle darin enthaltenen Variablen hat.

Eine Variable ist in der Schließung enthalten, wenn Sie

  1. ordnen Sie es mit var foo=1;oder zu
  2. einfach schreiben var foo;

Wenn eine innere Funktion (eine Funktion, die in einer anderen Funktion enthalten ist) auf eine solche Variable zugreift, ohne sie mit var in ihrem eigenen Bereich zu definieren, ändert sie den Inhalt der Variablen im äußeren Abschluss .

Eine Schließung überlebt die Laufzeit der Funktion, die sie erzeugt hat. Wenn andere Funktionen aus dem Abschluss / Bereich, in dem sie definiert sind (z. B. als Rückgabewerte), herauskommen , verweisen diese weiterhin auf diesen Abschluss .

Beispiel

function example(closure) {
  // define somevariable to live in the closure of example
  var somevariable = 'unchanged';

  return {
    change_to: function(value) {
      somevariable = value;
    },
    log: function(value) {
      console.log('somevariable of closure %s is: %s',
        closure, somevariable);
    }
  }
}

closure_one = example('one');
closure_two = example('two');

closure_one.log();
closure_two.log();
closure_one.change_to('some new value');
closure_one.log();
closure_two.log();

Ausgabe

somevariable of closure one is: unchanged
somevariable of closure two is: unchanged
somevariable of closure one is: some new value
somevariable of closure two is: unchanged




javascript dom dojo