Come ottenere il testo evidenziato in JavaScript?

Come ottenere il testo evidenziato in JavaScript?

Durante lo sviluppo di siti Web dinamici, gli sviluppatori devono spesso recuperare il testo evidenziato o selezionato dall'utente. Ciò può essere efficace per più situazioni, come consentire agli utenti di copiare e incollare il testo o intraprendere qualche altra azione in base al contenuto evidenziato/selezionato.

Questo tutorial dimostrerà:

  • Come ottenere il testo evidenziato in JavaScript?
  • Suggerimento bonus: evidenzia il testo usando il "documento.metodo getSelection () "

Come ottenere il testo evidenziato in JavaScript usando la "finestra.metodo getSelection () "?

IL "finestra.getSelection ()"Il metodo è un metodo predefinito JavaScript che fornisce un"Selezione"Oggetto come una rappresentazione del testo che ora è selezionato nella pagina. L'oggetto "selezione" indica uno o più intervalli di testo che l'utente ha scelto.

Esempio

Nell'esempio dato, recupereremo il testo selezionato dalla pagina web. Innanzitutto, creeremo un paragrafo di testo usando un HTML

elemento e assegnare un ID "Messaggio"Ciò aiuta a ottenere questo paragrafo per applicare diverse funzionalità:

LinuxHint è una risorsa eccellente per conoscere Linux e il relativo software open source. Offre anche molti tutorial e guide su diversi linguaggi di programmazione, come Java, Python, HTML, CSS, JavaScript e così via. Linuxhint fornisce informazioni semplici, chiare e autentiche.

Ora creeremo un'area per la stampa/visualizzazione del testo recuperato nella pagina Web utilizzando l'elemento:

Testo evidenziato: id = "evidenziato">

In JavaScript, definisci una funzione chiamata "seleziona il testo()"Ciò restituirà l'oggetto selezionato chiamando"finestra.getSelection ()" metodo:

funzione selectText ()
Se (finestra.getSelection)
Finestra di ritorno.getSelection ();

Definisci, un'altra funzione chiamata "gethighlightEdText ()"Che invocherà la funzione" selectText () "per stampare il testo evidenziato:

funzione geThighLightEdText ()
documento.getElementById ("evidenziato").InnerText = SelectText ();

Ora, ottieni il riferimento del paragrafo utilizzando l'ID assegnato e quindi chiama la funzione "GeThighLightedText ()" sull'evento click:

documento.getElementById ("Messaggio").addEventListener ("Click", GethighLightEdText);

Puoi vedere che il testo evidenziato è stato recuperato con successo:

Si tratta di recuperare il testo evidenziato in JavaScript.

Conclusione

Per ottenere il testo selezionato o evidenziato sulla pagina Web, utilizzare il “finestra.getSelection ()Metodo o il "documento.getSelection ()" metodo. Entrambi i metodi sono gli stessi in termini di prestazioni. Usa la "finestra.Metodo getSelection () "per la selezione degli oggetti per l'intera finestra. Mentre il "documento.il metodo getSelection () ”viene utilizzato per l'oggetto di selezione per il documento corrente.