Discussion :

[Philorix]

Bonjour,

Comment affecter une valeur à un style en ayant le nom du style et la valeur dans une variable ?

Le code ci-dessous fonctionne sous Firefox mais pas sur IE, existe t'il une autre syntaxe ?

objY.style[p] = v;

'P' contenant le nom du style et 'v' la valeur.

Merci pour vos réponses...

[willoi]

je comprends pas vraiment ce que tu veux exactement ,
tu cherche a changer le style d un element par javascript c est ca ?

[Philorix]

je comprends pas vraiment ce que tu veux exactement ,
tu cherche a changer le style d un element par javascript c est ca ?

Oui c'est ça, mais le nom de mon style est dans une variable !

[SpaceFrog]

avec eval mais pas très beau ...

Code :

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

eval('objY.style.'+monstyle)= v

sinon faudrait passer par un parsing du cssText ...

[Philorix]

Ecrit comme cela, ça fonctionnerais dans certain cas :

Code :

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

eval('objY.style.'+p+'='+v);

Mais cela ne fonctionne pas pour les noms de style qui contiennent un '-', comme 'border-right' par exemple.

Une autre idée ?

[SpaceFrog]

parceque ce n'est pas border-right en javascript mais borderRight.

je fouille dans mes archives ...

tu passes par des classes ou par le style dans la balise ?

[willoi]

oui en effet en cas de classe tu peux utiliser la propriete className,
ce qui me parait le plus simple.

[SpaceFrog]

je pensais audelà du className à attaquer directement le fichier css

Code :

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

1
2
3
4
5
 
var st=document.styleSheets[0];
var ru=st.rules?st.rules:st.cssRules;
var Classe=(ru[0].selectorText) 
var Props= (ru[0].style.cssText)

[Macintoc]

Et ça, ça fonctionnerais pas ?

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
function setStyle(elementHtml, styleName, styleValue){
    var style=elementHtml.getAttribut('style');
    var start=style.lastIndexOf(styleName);
    if(start){
        start+=styleName.length+1;
        var end=style.indexOf(';', start);
        if(!end) end=style.length;
        style=style.subString(0, start)+':'+styleValue+style.subString(end);
    }else style+=styleName+':'+styleValue+';';
    elementHtml.setAttribut('style', style);
}
 
setStyle(ObjY, p, v);

[SpaceFrog]

oulà usine à gaz ...
un split serait bien plus simple ...

[Macintoc]

Je connais pas de méthode pour récupérer l'index d'une valeur dans un Array, si ce n'est en coder une.

Le deuxième défaut en passant par un split, c'est que les séparateur (';' et ',') peuvent être précédé ou suivi d'espaces (ou pas). Donc on se retrouve avec des éléments pouvant avoir des espaces avant ou après le nom ou la valeur du style. Ce qui facilite pas la recherche.

[SpaceFrog]

suffit de faire le split sur un regExp ...

[Macintoc]

En effet, j'y avais pas pensé (et pour cause, je suis incapable d'en produire une correct).

Mais y a toujours la recherche d'index a coder, non ?

[SpaceFrog]

ben non si tu fais un split tu récupères les éléments séparés ... après au pire juste un substring pour le premier caractère et un join

[Philorix]

Finalement comme mon but était de cloner un 'Element', plutot que de mis prendre propriété par prorpriété, je fait tout d'un coup avec ce code :

Code :

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

1
2
3
4
5
6
7
8
9
 
var oY = document.createElement("label");  
if(oY.style.setAttribute) { 
        oY.style.setAttribute('cssText', oX.style.cssText);   
}
else  {
        oY.setAttribute("style", oX.style.cssText);	
} 	
document.body.appendChild(oY);

Où oX est mon 'Element' à cloner !

Merci pour votre aide.

@+

[Macintoc]

Remarque, si tu te lance dans les regXP, il suffit de faire un

Code :

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

1
2
3
4
 
var styleString=styleName+':'+styleValue+';';
style=style.replace(REGXP, styleString);
if(!style.IndexOf(styleString)) style+=';'+styleString

[SpaceFrog]

pourquoi pas direct un cloneNode(true) ???

Code :

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

var oY = oX.cloneNode(true)