Exercice 4/7

Dans le fichier script.js :

  • récupérez le div;
  • ajoutez-lui la propriété css "color" et la valeur "blue";
  • cliquez sur Soumettre ma réponse.

Leçon 4/7

Il est possible de modifier l'apparence d'un élément HTML.

Exemple :

element.style.fontSize = "1em";

Ici on récupère un élément HTML et on modifie la taille de son texte.

Commentaires les mieux notés

42 Commentaires

  • guillaume_c_3d

    guillaume_c_3d

    Le problème, c'est qu'il est dit "d'ajouter" la propriété, alors qu'il faut la modifier. Mais sans accès au CSS, impossible de le deviner.

    le 23/05/2022 à 16h05

  • meriam

    meriam Admin

    Bonjour, il faut modifier le comportement de l'élément div en ajoutant une propriété css.

    le 24/05/2022 à 10h53

  • meriam

    meriam Admin

    Voir la parit leçon.

    le 24/05/2022 à 10h53

  • mimouni.a-13

    mimouni.a-13

    quelle leçon évoque le var modi, ou modi.? svp... merci!

    le 16/07/2020 à 12h39

  • meriam

    meriam Admin

    Bonjour, regrdez la partie cours de la leçon modifier un élément html.

    le 17/07/2020 à 07h10

  • zedixa-68

    zedixa-68

    Bonjour, mon code fct mais non validé : var modif = document.querySelector('div'); modif.style.color = "blue";

    le 07/06/2020 à 15h03

  • meriam

    meriam Admin

    Bonjour, votre dernier code fonctionne correctement.

    le 08/06/2020 à 11h07

  • veronique.nollet

    veronique.nollet

    Je pense que je peux être contente des mon brainstorming et vous propose la solution suivante en une seule ligne pour cet exercice : var modif = document.querySelector("div").style.color="blue";

    le 09/05/2018 à 14h20

  • mram

    mram Admin

    Bonjour, vous pouvez en effet, c'est correct :)

    le 13/05/2018 à 23h06

  • duboisdelphine-16

    duboisdelphine-16

    merci !!!!!!

    le 12/04/2018 à 10h06

  • duboisdelphine-16

    duboisdelphine-16

    là, je sèche, ca fait 10 fois que je change la manière de faire, et ça ne marche toujours pas. j'ai tenté de mettre juste color au lieu de font-color, ça n'a pas marché, j'ai essayé d'autres manières, ça ne marche pas non plus. Quelqu'un peut m'aider svp?

    le 05/04/2018 à 04h37

  • mram

    mram Admin

    Bonjour, vos premières tentatives étaient plus proche de la solution que vos derniers essais. Dans votre code actuel, la ligne est inutile, la ligne 2 ok. Il suffira de rajouter la ligne pour changer la couleur à partir de la variable "modif" que vous utilisez.

    le 10/04/2018 à 20h37

  • mram

    mram Admin

    Reprenez l'exemple de la leçon, il suffit de remplacer "element" par "modif" et de mettre la bonne propriété CSS.

    le 10/04/2018 à 20h38

  • duboisdelphine-16

    duboisdelphine-16

    quand je mets ceci : var modif = document.querySelector("div"); div.style.font-color = "blue"; j'obtiens ce message d'erreur :Invalid left-hand side in assignment. Quel est le problème?

    le 29/03/2018 à 09h05

  • mram

    mram Admin

    Bonjour, ce n'est pas "font-color" qu'il faut mettre, mais juste "color".

    le 31/03/2018 à 22h08

  • djalloh2016-72

    djalloh2016-72

    une réponse pour l'exo en 2 lignes de codes;;;trop facile mais attention le cerveau doit bosser

    le 01/03/2018 à 13h44

  • jecht38

    jecht38

    Une erreur toute bête que j'ai corrigé moi-même... Merci quand même.

    le 02/01/2018 à 14h29

  • jecht38

    jecht38

    Hello, j'ai du mal sur cet exercice... Un petit coup de main vis-à-vis de mes essaies, pls ?

    le 02/01/2018 à 14h17

  • guilours

    guilours

    Ok, j'ai compris que ma ligne 'element.setAttribute('color');' ne servait à rien, j'ai fait le lien avec la leçon précédente pensant qu'il fallait cette ligne pour ensuite modifier 'color'.

    le 19/12/2017 à 10h20

  • guilours

    guilours

    Bonjour, j'ai suivi la même logique que dans les exercices précédents, en utilisant donc querySelector() pour la Div, setAttribute() pour ajouter "color", et style.color= pour indiquer "blue". Mais j'ai l'erreur "L'élément div ne possède pas la bonne couleur de texte." Je vais faire une pause car je ne vois pas le soucis. Le "div" mal récupéré avec querySelector() ?

    le 18/12/2017 à 17h02

  • mram

    mram Admin

    Bonjour, il n'y a pas besoin d'utiliser setAttribute() . On ne souhaite pas ajouter un attribut à la balise div dans le HTML, mais modifier la propriété CSS color.

    le 23/12/2017 à 14h18

  • alexismoquet

    alexismoquet

    bjr, pourquoi mon code ne va pas svp ?

    le 06/10/2017 à 12h10

  • mram

    mram Admin

    Bonjour, il fallait affecter document.querySelector() à une variable. Et alert() ne sert à rien ici.

    le 08/10/2017 à 20h37

  • Bérénice

    Bérénice

    je ne comprends pourquoi on n'accepte pas document.getElementsByTagName('div') pénible de chercher pendant 1h le code de ce site alors que mon code est bon...

    le 21/09/2017 à 06h38

  • mram

    mram Admin

    Bonjour, oui en effet, mais il est préférable d'utiliser .querySelector() qui est beaucoup plus flexible car ça permet d'utiliser la syntaxe des sélecteurs CSS qui est beaucoup plus riche.

    le 22/09/2017 à 13h57

  • mram

    mram Admin

    Eh oui, la variable "div" n'existe pas. Quand on demande de récupérer un élément HTML (ici div), il faut utiliser ce qui a été vu dans les exercices précédant (querySelector() etc.).

    le 24/10/2016 à 09h16

Pour publier un commentaire, vous devez vous connecter.
index.html
script.js
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DOM</title> </head> <body> <h1>Titre h1</h1> <p class="par">Paragraphe 1</p> <h2>Titre h2</h2> <p class="par">Paragraphe 2</p> <ul> <li>Item 1</li> <li>Item 2</li> <li><a href="http://www.google.fr">Item 3</a></li> </ul> <div id="bloc"> <h3>Titre h3</h3> <p class="par">Paragraphe 4</p> </div> <script src="script.js"></script> </body> </html>
http://localhost:8080