Nwlapcug.com


JQuery: Come eseguire il wrapping di una struttura HTML intorno a una selezione di testo

JQuery: Come eseguire il wrapping di una struttura HTML intorno a una selezione di testo


La libreria di script jQuery è utile per aggiungere e rimuovere codice per le azioni dell'utente basati su documenti HTML e si può anche utilizzare script jQuery per animare parti delle pagine Web. Se si desidera aggiungere tag intorno a un testo in una pagina Web, è possibile utilizzare la funzione di "avvolgere" di jQuery. Selezionare il testo utilizzando un selettore CSS - codice al tag HTML di destinazione-- in una funzione e quindi scrivere il codice per eseguire il wrapping di tag intorno ad esso.

Istruzioni

1

Aggiungere la libreria jQuery al vostro Web page. Prendi questo codice e metterlo da qualche parte sopra il tag di chiusura < / head > ma sopra qualsiasi altro tag < script >:

< script funzione tra un nuovo tag del set di < script > da qualche parte sotto il tag che fa riferimento alla libreria jQuery. Ecco come appare:

< script type = "text/javascript" >

Web {

// Your code will go here

});

< / script >

La funzione di "documento pronto" rende il codice jQuery attendere che la pagina da caricare prima che tenta di eseguire. Usando questo aiuterà a prevenire errori sulla tua pagina Web.

3

Creare una nuova funzione per selezionare la parte della pagina Web che si desidera eseguire il wrapping di tag intorno. Selezionare il testo da nome del tag e, quindi, un nome ID o una classe come si farebbe in CSS. Esaminare il file HTML per la tua pagina Web determinare quali tag per selezionare.

Ecco un esempio di funzione:

$('selector').each(function() () {

Codice andrà qui

});

Modificare "selettore" con un selettore CSS come "p .wrapme" per un tag < p > con un nome di classe di "wrapme." Quando si seleziona da un ID, è possibile modificare il punto davanti al nome di ID in un simbolo di cancelletto.

4

Copiare e incollare il codice tra le parentesi graffe nella funzione selettore:

$(questo) wrap ('< tagname >' + questa + ' </tagname >');

Modificare il nome del tag che si desidera avvolgere attorno al testo selezionato "tagname". È possibile aggiungere attributi al tag pure. In questo codice, "this" è l'abbreviazione per il selettore. Il nuovo tag andrà all'esterno dei tag selezionati.

Consigli & Avvertenze

  • Nozioni di base di CSS per ottenere una migliore comprensione di come utilizzare jQuery, che è stato progettato per uso con i CSS. Poiché jQuery è una libreria JavaScript, imparare JavaScript per migliorare le vostre abilità di jQuery.
  • Salvare sempre i file HTML e CSS prima di modificarli.