Trovare una stringa di testo in un elemento e avvolgere alcuni tag span intorno ad esso

voglio trovare una stringa di testo in un elemento e avvolgere alcuni tag span intorno ad esso. Ad esempio:Trovare una stringa di testo in un elemento e avvolgere alcuni tag span intorno ad esso

Da <h2>We have cows on our farm</h2>-<h2>We have <span class='smallcaps'>cows</span> on our farm</h2>

ho provato:

$("h2:contains('cow')").each(function() { 
$(this).text().wrap("<span class='smallcaps'></span>"); 
});

Ma che avvolge solo l'intera contenente tag h2.

fonte

2013-04-18 Seb

$("h2:contains('cow')").html(function(_, html) { 
    return html.replace(/(cow)/g, '<span class="smallcaps">$1</span>'); 
});

http://jsfiddle.net/w5ze6/1/

fonte

2013-04-18 18:32:18 undefined

Chiedo perché sono interessato - Dove posso trovare della documentazione sulla sintassi che stai usando? In particolare la funzione '(_, html)'. –

@Evan Penso che la migliore sia la documentazione di jQuery, http://api.jquery.com/html/, a partire da jQuery 1.4, il metodo 'html' accetta una funzione, il primo parametro è index e il secondo è contenuto html . – undefined

Sì, l'ho visto, ma puoi semplicemente fornire '_' come l'indice in questo modo? È fondamentalmente solo l'invio di un indice nullo? –

Un altro approccio, raggruppati per parola chiave e unirsi con il codice html aggiornato.

$("h2:contains('cow')").html(function(_, html) { 
    return html.split('cow').join("<span class='smallcaps'>cow</span>"); 
});

Nota: non ho ancora testato questo, ma sto assumendo questo sarebbe eseguire peggio di fare una sostituzione, ma dato che includerebbe comunque per scopi informativi

fonte

2013-04-18 18:31:04

Funziona bene amico grazie :) –

Grazie, quello sopra è stata in mancanza quando c'erano tag html intorno alla parola chiave per cominciare. Questo funziona perfettamente. Bello avere un'alternativa. –

so che è da diversi anni su tutta la linea, ma ho creato un violino di lavoro per questa risposta .... http://jsfiddle.net/v2nqu05o/ – Studocwho

$("h2:contains('cow')").each(function() { 
    var newText = $(this).html().replace("cow", "<span class='smallcaps'></span>"); 
    $(this).html(newText); 
});

fonte

2013-04-18 18:32:04

si dovrebbe cambiare per impostare il codice HTML dell'elemento, non il text –

@JustinBicknell Buon punto, aggiornato. –

Nel mio caso ho alcuni tag all'interno del div di destinazione e del testo ho bisogno di avvolgere il testo in un link.

Come ho seguito "Cosa hai provato".

var oldText = $(this).text(), 
newText = $(this).html().replace(
    oldText, 
    "<a class='k-link' href='#' class='smallcaps'>" + 
     oldText + 
    "<span class='k-icon k-i-arrow-n'></span></a>" 
); 
$(this).html(newText);

fonte

2015-03-05 19:45:52 Shraftali

Trovare una stringa di testo in un elemento e avvolgere alcuni tag span intorno ad esso

risposta

Problemi correlati