Jak uzyskać podświetlony tekst w JavaScript?

Jak uzyskać podświetlony tekst w JavaScript?

Podczas opracowywania dynamicznych stron internetowych, programiści często muszą odzyskać podświetlony lub wybrany tekst przez użytkownika. Może to być skuteczne w wielu sytuacjach, takich jak umożliwienie użytkownikom kopiowania i wklejania tekstu lub podejmowanie innych działań w oparciu o podświetloną/wybraną treść.

Ten samouczek pokaże:

  • Jak uzyskać podświetlony tekst w JavaScript?
  • Wskazówka bonusowa: Podświetl tekst przy użyciu „Dokument.metoda getSelection () ”

Jak uzyskać podświetlony tekst w JavaScript za pomocą „okna.metoda getSelection () ”?

„„okno.getSelection ()„Metoda to predefiniowana metoda JavaScript, która daje„Wybór„Obiekt jako reprezentacja tekstu, który jest teraz wybrany na stronie. Obiekt „Wybór” wskazuje jeden lub więcej zakresów tekstu, które wybrał użytkownik.

Przykład

W danym przykładzie odzyskamy wybrany tekst ze strony internetowej. Najpierw utworzymy akapit tekstowy za pomocą HTML

element i przypisz identyfikator „wiadomość”To pomaga uzyskać ten akapit do stosowania różnych funkcji:

Linuxhint jest doskonałym zasobem do nauki o Linux i powiązanym oprogramowaniu open source. Oferuje także wiele samouczków i przewodników dotyczących różnych języków programowania, takich jak Java, Python, HTML, CSS, JavaScript i tak dalej. Linuxhint zapewnia proste, jasne i autentyczne informacje.

Teraz utworzymy obszar do drukowania/wyświetlania odzyskanego tekstu na stronie internetowej za pomocą elementu:

Podświetlony tekst: id = "extionedText">

W JavaScript zdefiniuj funkcję o nazwie „Wybierz tekst()„To zwróci wybrany obiekt, wywołując„okno.getSelection ()" metoda:

funkcja selectText ()
if (okno.GetSelection)
okno powrotu.getSelection ();

Zdefiniuj, kolejna funkcja zwana „gethighlightEdText ()”, Który wywoła funkcję„ SelectText () ”, aby wydrukować podświetlony tekst:

funkcja gethighlightedText ()
dokument.getElementById („podświetlonyText”).innerText = selectText ();

Teraz uzyskaj odniesienie do akapitu za pomocą przypisanego identyfikatora, a następnie wywołaj funkcję „GethighlightEdText ()” w wydarzeniu kliknięcia:

dokument.getElementById („Message”).addEventListener („kliknij”, gethighlighttext);

Widać, że podświetlony tekst został pomyślnie odzyskany:

Chodzi o odzyskanie podświetlonego tekstu w JavaScript.

Wniosek

Aby uzyskać wybrany lub podświetlony tekst na stronie internetowej, użyj „okno.getSelection ()”Metoda lub„dokument.getSelection ()" metoda. Obie metody są takie same pod względem wydajności. Użyj okna „.GetSelection () ”metoda wyboru obiektów dla całego okna. Podczas gdy dokument „dokument.Metoda getSelection () ”jest stosowana dla obiektu wyboru bieżącego dokumentu.