Discussion :

[openpixel]

Bonjour à tous,

Je suis nouveau sur ce forum et j'ai peu d'expérience en développement en général. J'arrive à faire les choses mais pas toujours dans les règles de l'art.

En l'occurrence, j'ai un code qui teste les classes de mon body, et si il y trouve une certaine classe, je veux qu'il m'actualise l'attribut src d'une balise image. Mon code ressemble à ça pour le moment (attention les yeux !!)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
if($('body').hasClass('section-sports')){$('.rub').attr('src', $('.rub').attr('src').replace('.png', 'bouton-sports.png'));}
if($('body').hasClass('section-solidarite')){$('.rub').attr('src', $('.rub').attr('src').replace('.png', 'bouton-solidarite.png'));}
if($('body').hasClass('section-citoyennete')){$('.rub').attr('src', $('.rub').attr('src').replace('.png', 'bouton-citoyennete.png'));}

Ça marche, mais comment simplifier le tout, pour que ça soit plus respectueux du langage ?

Merci d'avance à ceux qui pourront m'aiguiller vers une solution !!

Anthony

[danielhagnoul]

Bonsoir

Le code est bon, mais on peut l'optimiser.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var jObjBody = $('body'), // l'élément "body"
	jObjRub = $('img.rub'), // tous les éléments "img" ayant la classe "rub"
	replaceRub = function(newSrc){ // replace ".png" by src
		jObjRub.attr('src', jObjRub.attr('src').replace('.png', newSrc));
	};
 
// je suppose qu'il ne peut y avoir qu'une seule de ces classes en même temps, donc "else if"
 
if ( jObjBody.hasClass('section-sports') ){
	replaceRub('bouton-sports.png');
} else if ( jObjBody.hasClass('section-solidarite') ){
	replaceRub('bouton-solidarite.png');
} else if ( jObjBody.hasClass('section-citoyennete') ){
	replaceRub('bouton-citoyennete.png');
}

[openpixel]

Bonjour Daniel, merci d'avoir pris le temps de me répondre. J'ai testé ton code et il fonctionne très bien. Je souhaiterais l'adapter encore un peu plus à mes contraintes mais ce n'est pas si simple.

J'ai tout placé dans une fonction dans un fichier .js à part et ça marche, c'est parfait !!

merci encore.

Anthony