Pourquoi « this.style[property] » renvoie-t-il parfois une chaîne vide en JavaScript ?

Pourquoi 'this.style[property]' renvoie-t-il une chaîne vide ?

Dans un programme JavaScript, accéder à 'this.style La propriété [propriété]' peut donner lieu à une chaîne vide. Cela peut se produire lorsque vous essayez de récupérer la valeur d'un style défini dans une feuille de style CSS.

La propriété 'this.style[property]' est conçue pour accéder aux styles en ligne, qui sont des styles définis directement à un élément HTML en utilisant l'attribut 'style'. Il ne récupère pas les styles définis dans les feuilles de style CSS externes ou intégrées.

Pour résoudre ce problème, utilisez la fonction getComputedStyle(). Cette fonction calcule les styles combinés d'un élément, y compris ceux définis par les feuilles de style :

const element = document.getElementById('myId');
const style = getComputedStyle(element);
console.log(style.height); // "100px"

Dans cet exemple, la fonction 'getComputedStyle()' est utilisée pour récupérer la propriété 'height' de l'élément. La console affichera la valeur « 100px », qui représente la hauteur définie dans la feuille de style.

Par conséquent, « this.style[property] », bien qu'utile pour accéder aux styles en ligne, ne convient pas pour définir des styles. dans les feuilles de style CSS. Utilisez 'getComputedStyle()' pour récupérer le style effectif d'un élément, englobant toutes les sources.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!