Hi Ich arbeite seit einiger Zeit mit contentEditable, und ich denke, dass ich mich ziemlich gut damit beschäftige. Eine Sache, die mir ausweicht, ist, wie man ein Array von Referenzen auf alle Knoten bekommt, die teilweise oder vollständig innerhalb der Auswahl des Benutzers liegen. Hat jemand eine Idee?
Hier ist was los:
%Vor% Hier ist eine Version, die Ihnen die tatsächlich ausgewählten und teilweise ausgewählten Knoten und nicht die Klone anzeigt. Alternativ könntest du meine Rangy -Bibliothek verwenden, die eine getNodes()
-Methode ihrer Range-Objekte hat und in IE & lt; arbeitet. 9.
Du bist so nah dran! Wenn Sie Document Fragment
an das temporäre Element span
anhängen, haben Sie sie in eine verwaltbare Gruppe umgewandelt, auf die Sie über das vertrauenswürdige childNodes
-Array zugreifen können.
Darüber hinaus bereiten Sie sich mit der for(i in selnodes)
-Schleife, die die Elemente im Array zurückgibt, PLUS der Eigenschaft length
und der __proto__
-Eigenschaft Probleme und alle anderen Eigenschaften, die das Objekt haben kann.
Sie sollten diese Arten von for
-Schleifen nur verwenden, wenn Sie die Eigenschaften in einem Objekt durchlaufen, und dann immer mit if (obj.hasOwnProperty[i])
, um vom Prototyp geerbte Eigenschaften herauszufiltern.
Verwenden Sie beim Durchschleifen von Arrays:
%Vor% Wenn Sie schließlich dieses Array geladen haben, müssen Sie jedes Element überprüfen, um zu sehen, ob es sich um einen DOM-Knoten oder einen Text-Knoten handelt, bevor Sie damit umgehen können. Das können wir tun, indem wir prüfen, ob es die Eigenschaft tagName
unterstützt.
Hier ist die ganze Sache:
%Vor%Below Code ist ein Beispiel, um Ihr Problem zu lösen, unterhalb von code geben Sie alle ausgewählten Knoten im Bereich
zurück %Vor%Tags und Links javascript html wysiwyg