Fare riferimento a gruppi nidificati in JavaScript usando la stringa sostituisci usando l'espressione regolare

Question

A causa del modo in cui jQuery si occupa dei tag di script, ho trovato necessario fare qualche manipolazione HTML usando espressioni regolari (sì, lo so...non lo strumento ideale per il lavoro).Sfortunatamente, sembra che la mia comprensione di come funzionano i gruppi catturati in JavaScript sia difettosa, perché quando provo questo:

var scriptTagFormat = /<script .*?(src="(.*?)")?.*?>(.*?)<\/script>/ig;

html = html.replace(
    scriptTagFormat, 
    '<span class="script-placeholder" style="display:none;" title="$2">$3</span>');

I tag di script vengono sostituiti con gli span, ma il risultato title l'attributo è vuoto.Non dovrebbe $2 abbinare il contenuto del src attributo di un tag script?

Answer 1

Sto pensando che le espressioni regolari da sole non possano fare esattamente quello che sto cercando, quindi ecco la mia modifica per aggirare il problema:

var scriptTagFormat = /<script\s+((.*?)="(.*?)")*\s*>(.*?)<\/script>/ig;

html = html.replace(
    scriptTagFormat, 
    '<span class="script-placeholder" style="display:none;" $1>$4</span>');

Prima, volevo evitare di impostare attributi non standard sulla sostituzione span.Questo codice copia ciecamente tutti gli attributi.Fortunatamente, gli attributi non standard non vengono rimossi dal DOM quando inserisco l'HTML, quindi funzionerà per i miei scopi.

Answer 2

L'annidamento dei gruppi è irrilevante;la loro numerazione è determinata rigorosamente dalle posizioni delle loro parentesi di apertura all'interno della regex.Nel tuo caso, significa che è il gruppo # 1 che cattura l'intero src="value" sequenza ,e il gruppo # 2 che cattura solo il value parte.

Answer 3

Prova questo:

/<script (?:(?!src).)*(?:src="(.*?)")?.*?>(.*?)<\/script>/ig

Vedi qui: rubulare

Come ha scritto stema, il .*? corrisponde troppo.Con il lookahead negativo (?:(?!src).)* si abbinerà solo fino a quando un src attributo.

Ma in realtà in questo caso si potrebbe anche solo spostare il .*? nella parte opzionale:

/<script (?:.*?src="(.*?)")?.*?>(.*?)<\/script>/ig

Vedi qui: rubulare

Answer 4

Il .*? corrisponde troppo perché il seguente gruppo è facoltativo, = = > il tuo src è abbinato da uno dei .*? intorno.se si rimuove il ? dopo il primo gruppo funziona.

Aggiornare:Come ha sottolineato @ morja, la tua soluzione è spostare il primo .*? nella parte src opzionale.

Solo per completezza: /<script (?:.*?(src="(.*?)"))?.*?>(.*?)<\/script>/ig

Puoi vederlo qui su rubular (corretto anche il mio link)

Se non si desidera utilizzare il contenuto del primo gruppo di acquisizione, renderlo un gruppo non di acquisizione utilizzando (?:)

/<script (?:.*?(?:src="(.*?)"))?.*?>(.*?)<\/script>/ig

Quindi il risultato desiderato è in $1 e $2.

Answer 5

Potresti pubblicare il codice html che stai recuperando?Il tuo codice funziona bene in un semplice esempio: jsfiddle (attenzione:alert box)

La mia prima ipotesi è che uno dei tuoi tag di script non abbia un src, il che significa che ti rimane un singolo gruppo di acquisizione (il contenuto dello script).