Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie bekomme ich das Wort in JavaScript unter den Cursor?

Patricia Arquette
Freigeben: 2024-10-24 17:28:02
Original
383 Leute haben es durchsucht

How to Get the Word Under the Cursor in JavaScript?

Das Wort unter den Cursor in JavaScript bringen

Das Ermitteln des Wortes, das sich aktuell unter dem Cursor in einem HTML-Dokument befindet, ist eine häufige Anforderung für die Textmanipulation Anwendungen. In diesem Artikel wird eine zuverlässige Methode untersucht, um dies mithilfe von JavaScript zu erreichen, insbesondere im Kontext moderner Browser wie Chrome.

Um das Wort unter dem Cursor zu bestimmen, nutzen wir die Funktionen des Range-Objekts des DOM. Dieser Ansatz durchläuft den Textinhalt des Elements und identifiziert das Wort, das die Position des Cursors umfasst, basierend auf seinem BoundingClientRect.

Die in der Antwort bereitgestellte JavaScript-Funktion getWordAtPoint() benötigt drei Parameter: das Element, das x-Koordinate des Cursors und die y-Koordinate des Cursors. Es durchläuft rekursiv die untergeordneten Knoten des Elements und erweitert die Suche, wenn sich der Cursor innerhalb des Begrenzungsrechtecks ​​eines Textknotens befindet. Sobald eine Übereinstimmung gefunden wird, gibt sie das identifizierte Wort zurück.

Für den Fall, dass sich der Cursor nicht über einem Textinhalt befindet, gibt die Funktion null zurück. Dies kann in einen Mousemove-Ereignishandler integriert werden, um das Wort unter dem Cursor dynamisch zu bestimmen, während der Benutzer die Maus über den Text bewegt.

Das obige ist der detaillierte Inhalt vonWie bekomme ich das Wort in JavaScript unter den Cursor?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage