Ich versuche, einen Teil des Textes auf meiner Website hervorzuheben. Dieser markierte Text wird für den jeweiligen Benutzer in einer Datenbank gespeichert. Wenn das Dokument erneut geöffnet wird, wird der zuvor hervorgehobene Text angezeigt. Ich nahm an, dass ich JavaScript verwenden würde, um den Text hervorzuheben, aber ich finde keinen Weg, um genau zu bestimmen, wo das Wort ist, das ich hervorhebe.
%Vor%Ich verwende das, um die Auswahl zu erhalten, aber ich kann nicht herausfinden, wo die Auswahl im Text ist. Der größte Ärger ist, wenn ich Duplikate in der Zeile oder im Text habe. Wenn ich also die Suche verwenden würde, würde ich die erste Instanz finden und nicht die, nach der ich gesucht habe.
Die Frage ist also: Wie lokalisieren Sie ein Wort oder eine Auswahl im gesamten Dokument?
Sie können meine Rangy -Bibliothek und ihre Auswahl Serialisierungsmodul für diese. Rangys Kern bietet eine einheitliche Auswahl- und Bereichs-API für alle Browser und das Serialisierungsmodul baut darauf auf, indem es jede Auswahlgrenze in einen Pfad durch das Dokument umwandelt. Weitere Informationen finden Sie in der verknüpften Dokumentation.
Dies ist sicherlich keine triviale Aufgabe, da Sie mit den zwei Hauptproblemen konfrontiert sind, den Text im aktuellen Dokument zu finden und ihn dann beim nächsten Seitenladevorgang wiederzufinden. Das Problem wird noch komplizierter, wenn sich der Inhalt Ihrer Seite ändern kann, da Sie sich nicht einmal darauf verlassen können, dass die relative Position des Textes gleich bleibt.
Sie sollten vielleicht überlegen, ob dies der beste Ansatz für alles ist, was Sie bei dem erforderlichen Aufwand erreichen möchten, aber hier ist etwas, das Sie in die richtige Richtung bringen könnte:
%Vor%Neben einer Methode, den Text erneut auszuwählen:
%Vor%Dieser Code macht die ziemlich naive Annahme, dass sich der ausgewählte Text alle im selben DOM-Element befindet. Die Chancen stehen hoch, dass ein Benutzer, der willkürlichen Text auswählt, dies nicht tun wird.
Wenn das Selection -Objekt dies mit den Eigenschaften anchorNode und focusNode berücksichtigt, Sie könnten versuchen, dies zu umgehen, auch wenn Sie sich mit dem TextRange -Objekt in Internet Explorer beschäftigen erweisen sich als ein bisschen problematischer.
Es gibt auch das Problem, wie Sie den position.node -Wert über Seitenanforderungen hinweg verfolgen können. In meinem jsFiddle-Beispiel habe ich eine leicht modifizierte Version von selector-generierende jQuery-Funktion , um eine Selektor-Zeichenfolge zu generieren, die sein kann gespeichert und verwendet, um später den richtigen Knoten erneut auszuwählen. Beachten Sie, dass der Prozess relativ trivial ist, so dass Sie es ohne jQuery leicht tun könnten - es ist einfach passiert, in diesem Fall etwas Aufwand zu sparen.
Natürlich, wenn Sie das DOM zwischen den Besuchen ändern, wird dieser Ansatz wahrscheinlich ziemlich instabil sein. Wenn Sie nicht sind, fühle ich mich wie es ist wahrscheinlich eine der zuverlässigeren Optionen.
createRange erstellt ein textRange-Objekt. Es enthält alle möglichen nützlichen Informationen:
%Vor%Tags und Links javascript html