Pourquoi ma modification CSS jQuery ne fonctionne-t-elle pas ?

Changer le CSS à l'aide de jQuery

En essayant de modifier le CSS avec jQuery, vous pouvez rencontrer des difficultés. Résolvons un problème courant.

Problème :

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor":"black","color":"white");
    $(".bordered").css("border", "1px solid black");
}

Malgré le respect de la syntaxe correcte, le code ne fonctionne pas.

Réponse :

L'erreur provient d'une accolade fermante manquante dans le Ligne $("#myParagraph").css(). Le code correct doit être :

$("#myParagraph").css({"backgroundColor": "black", "color": "white"});

Cette modification entraîne une fonction JavaScript fonctionnelle qui modifie avec succès les éléments CSS. Pour clarifier, les deux notations de nom de propriété CSS, « backgroundColor » et « background-color », sont valides dans jQuery. La documentation de l'API jQuery le confirme.

Voici une démo en direct : http://jsfiddle.net/YPYz8/

Code de travail complet :

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor": "black", "color": "white"});
    $(".bordered").css("border", "1px solid black");
}

Cet extrait de code montre comment changer la couleur d'arrière-plan de l'élément h1 en jaune, la couleur d'arrière-plan de l'élément avec l'ID "myParagraph" en noir et la couleur du texte de cet élément en blanc. De plus, il ajoute une bordure noire de 1 px à tous les éléments avec la classe « bordered ».

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!