getComputedStyle pour récupérer background-color

**klod2.0** · 23/02/2016, 01h24

Bonjour,
Je cherche à récupérer la valeur de background-color de la balise body.
J'utilise la fonction getComputedStyle mais ça ne fonctionne pas.
Voici le code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<html lang="fr-fr">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<title>Page de test</title>
<style type="text/css">
body {
background-color: rgb(173, 216, 230);
color: #4A4E53;
margin: 0;
padding: 0;
}
</style>
<script type="text/javascript"> 
var bodi = document.getElementsByTagName("body");
var b_style = document.defaultView.getComputedStyle(bodi, null).getPropertyValue("background-color");
alert (b_style);
</script>
</head>
<body>
<h2>Bonjour</h2>
</body>
</html>

La fenêtre alert ne s'ouvre pas.
Merci pour votre aide.

**danielhagnoul** · 23/02/2016, 02h55

Presque bon... Voir : https://developer.mozilla.org/fr/doc...tComputedStyle

EDIT 03:13 pour une ) mal placée

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
var bodyCSS = window.getComputedStyle( document.querySelector( 'body' ), null );
 
// debug, console, touche F12
console.log( bodyCSS.getPropertyValue( 'background-color' ) );

**melka one** · 23/02/2016, 19h23

jour

cette ligne retourne une nodeliste

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementsByTagName("body")

il faut donc ecrire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

bodi[0]

**klod2.0** · 23/02/2016, 22h06

Merci à tous. J'ai trouvé des infos sur nodelist sur un autre site.
Avec tous ces éléments, je crois pouvoir pondre un nouveau code qui tienne la route.

**SylvainPV** · 24/02/2016, 00h45

plus simplement:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var couleurFond = getComputedStyle(document.body).getPropertyValue("background-color")

getComputedStyle pour récupérer background-color

JavaScript

Discussions similaires

Partager

Partager