Comment référencer une propriété d'objet JavaScript contenant un trait d'union ?

Question

J'utilise cette script pour créer un objet style de tous les styles hérités, etc.

var style = css($(this));
alert (style.width);
alert (style.text-align);

Dans le cas suivant, la première alerte fonctionnera correctement, mais pas la seconde... elle interprète le code - comme un moins, je suppose. Le débogueur indique "uncaught reference error". Mais je ne peux pas l'entourer de guillemets, car ce n'est pas une chaîne de caractères. Comment puis-je donc utiliser cette propriété d'objet ?

Answer 1

alert(style.textAlign)

o

alert(style["textAlign"]);

Answer 2

Les propriétés de style avec trait d'union sont référencé via camelCase en JavaScript , donc utiliser style.textAlign .

Answer 3

Pour résoudre votre problème : Les propriétés CSS contenant des traits d'union sont les suivantes représentées par des propriétés JavaScript en camelCase pour éviter ce problème. Vous voulez : style.textAlign .

Pour répondre à la question : Utilisation la notation entre crochets : obj.prop est identique à obj["prop"] afin de pouvoir accéder aux noms des propriétés à l'aide de chaînes de caractères et d'utiliser des caractères interdits dans les identificateurs.

Answer 4

Je pense que dans le cas des styles CSS, ils sont transformés en camelCase dans JavaScript, donc test-align devient textAlign .

Dans le cas général, lorsque vous souhaitez accéder à une propriété qui contient des caractères non standard, vous utilisez le style tableau : ['text-align']

Answer 5

Les noms des propriétés de l'objet ne correspondent pas exactement aux noms CSS.