JQuery, modifier du texte

Bonjour,

J'ai un texte écris au format Markdown sous cette forme :

### Un titre
[un indice] (un autre indice)

Ceci donne comme résultat :

<h3>Un titre</h3>
<p>[un indice] (un autre indice)</p>

Je souhaites apporter ce genre de modification (ajout des spans + classes) :

<h3>Un titre</h3>
<p><span class="toto">[un indice]</span> <span class="titi">(un autre indice)</span></p>

Je peux avoir que des [] ou le couple [] et (). Dans le premier cas, facile, j'arrive à faire ma sauce. C'est pour le deuxième cas que je solicite votre aide. J'ai commencé ce genre de code :

$('h3 + p:first').filter(function(index) {
result =''
			if(/[un indice]/.test(this)) {
			 	result = '<span class="titi">un indice</span>';
			}

			return result;
		});

Rien ne ce passe, je rentre bien dans mon if et mon this représente bien mon contenu HTML.

Merci pour votre aide.
Modifié par MagicCarpet (03 Nov 2014 - 16:20)

Alors j'ai apporté quelques modifications :

$('h3 + p:first').html(function() {
	if(/^[.+]|(.+)/.test(this)) {
		alert($(this).text().replace(/indice/, 'toto'));
		$(this).text().replace(/indice/, 'toto');
	}
})

Dans mon alerte la modification est bien apportée mais pas celle dans ma page HTML.

Une petite idée ?
Modifié par MagicCarpet (03 Nov 2014 - 15:08)

Bonjour

la fonction .replace() renvoie une chaine de caractères, cette fonction ne modifie pas le DOM, il faudrait stocker le résultat dans une chaine puis modifier le contenu de 'this' avec cette chaine :

 chaine = $(this).text().replace(/indice/, 'toto');
$(this).text(chaine);

Merci pour la réponse.

En fait j'ai avancé sur le sujet et ma page est bien rafraichie. Par contre je vais vous montrer mon code car je me demande si on ne peux pas l'améliorer un peu, donc voici :

var pattern = [
	[/^\[\[(.+?)\]\]/, '<span class="c-classe">$1</span>'],
	[/\(\((.+?)\)\)/, '<span class="c-classe">$1</span>']
];

pattern.forEach(function (pattern) {
	content = content.replace(pattern[0], pattern[1]);
});

$(this).html(content);

En gros, si dans mon texte j'ai ceci :
- \[\[indice\]\] ou
- ((indice)) ou encore :
- \[\[indice\]\] ((indice))

Ca fonctionne parfaitement. Par contre si j'ai :
- ((indice)) ((indice))

Là, je ne comprends pas pourquoi mais le premier "indice" est pris en compte, pas le second.

Je suis donc obligé de faire ceci avec mon JS :

var pattern = [
	[/^\[\[(.+?)\]\]/, '<span class="c-classe">$1</span>'],
	[/\(\((.+?)\)\) \(\((.+?)\)\)/, '<span class="c-classe">$1</span> <span class="c-classe">$2</span>'],
	[/\(\((.+?)\)\)/, '<span class="c-classe">$1</span>']
];

pattern.forEach(function (pattern) {
	content = content.replace(pattern[0], pattern[1]);
});

$(this).html(content);

Une idée d'amélioration peut-être ? Merci.

PS : les \[ ou \] sont présents pour éviter une images avec un lien cassée.
Modifié par MagicCarpet (04 Nov 2014 - 15:27)