Obtenez l'attribut de style sur l'élément dom via JavaScript, et nous pouvons attribuer dynamiquement des attributs de style à l'élément. Dans jQuery, si nous voulons modifier dynamiquement l'attribut style, il suffit d'utiliser la méthode css() pour réaliser cette méthode
css() : obtenir la valeur calculée de l'attribut style de l'élément ou définir le CSS attribut de l'élément
Get :
css( propertyName ) : récupère la valeur calculée de l'attribut de style du premier élément de la collection d'éléments correspondants
css( propertyNames ) : Passe un tableau et renvoie un résultat d'objet
Paramètres :
css(propertyName, value) : Définir CSS
css(propertyName, function) : Vous pouvez transmettre un fonction de rappel et renvoyer la valeur correspondante. Traitement
css (propriétés) : Vous pouvez transmettre un objet et définir plusieurs styles en même temps
Remarque :
Les propriétés du navigateur sont obtenu de différentes manières. Lors de l'obtention de certaines valeurs, All jQuery utilise un traitement unifié, comme l'utilisation de RBG pour la couleur et px pour la taille. La méthode css() prend en charge l'écriture de cas camel et l'écriture de cas mixte est effectuée. uniquement en tant que valeur, jQuery le convertira en chaîne et ajoutera px à la fin de la chaîne, comme .css("width",50}) et .css("width", "50px"})
Jetons un coup d'œil à un morceau de code :
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <div>php 中文网</div> <script> $('div').css('color','red'); </script> </body> </html>
Changez le style du contenu dans le div
Regardons ce qui se passe si plusieurs styles sont modifiés, par exemple , si je souhaite définir une largeur, une hauteur ou un arrière-plan pour une balise div, comment dois-je l'écrire ?
Ensuite, commençons à écrire un morceau de code comme celui-ci :
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <div>php 中文网</div> <script> $("div").css({ width:'200px', height:'200px', background:'#ccc' }); </script> </body> </html>
En regardant le code ci-dessus, nous pouvons définir la largeur et la hauteur de l'arrière-plan de ススv selon le style que nous voulons
Remarque : lorsque nous écrivons, nous devons terminer un attribut par une virgule. Lorsque nous écrivons le dernier, nous pouvons le faire sans virgule