[JAVASCRIPT-DOM] propriété classe CSS
Résolu/Fermé
sixland
Messages postés
36
Date d'inscription
mardi 12 mars 2002
Statut
Membre
Dernière intervention
26 juin 2005
-
22 juin 2005 à 12:31
GexMole - 6 mars 2009 à 12:54
GexMole - 6 mars 2009 à 12:54
bonjour,
je dois recuperer la propriété de style d'un élément html, cette propriété est contenue dans une feuille de style .css qui est contenu dans une classe css.
si la propriété est declarée dans la balise avec l'attribut 'style' je sais la recuperer mais qd c'est dans une class je n'y arrive pas
en fait j'utilise un
je dois recuperer la propriété de style d'un élément html, cette propriété est contenue dans une feuille de style .css qui est contenu dans une classe css.
si la propriété est declarée dans la balise avec l'attribut 'style' je sais la recuperer mais qd c'est dans une class je n'y arrive pas
en fait j'utilise un
...
alert (document.getElementById('truc').style.height);
...
A voir également:
- [JAVASCRIPT-DOM] propriété classe CSS
- Telecharger javascript - Télécharger - Langages
- Trait css ✓ - Forum CSS
- Bluetooth mercedes classe a 2005 - Forum Autoradio
- Copain d'avant photo de classe - Forum Réseaux sociaux
- Crush dom tom - Forum Consommation & Internet
5 réponses
Utilisateur anonyme
24 juin 2005 à 13:42
24 juin 2005 à 13:42
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Accès aux valeurs CSS avec Javascript</title>
<link rel="stylesheet" type="text/css" href="testCss.css" />
<script language="javascript" type="text/javascript">
function testCss(tagRef,element){
alert("L'attribut '"+element+"' du tag '"+tagRef+"' a la valeur '"+getCssValue(tagRef,element)+"'");
}
function getCssValue(tagRef,element) {
var tag = document.all(tagRef);
var value= tag.style[element];
if(value==null || value=='' || value=='undefined'){
var aClass = tag.className;
var cssRules = 'rules';
for (var sSheet=0; sSheet < document.styleSheets.length; sSheet++){
for (var rule=0; rule < document.styleSheets[sSheet][cssRules].length; rule++) {
var currentClass = document.styleSheets[sSheet][cssRules][rule].selectorText.substring(1);
if (currentClass == aClass) {
return document.styleSheets[sSheet][cssRules][rule].style[element];
}
}
}
}
return value;
}
</script>
</head>
<body>
<span id="truc1" style="color: blue;">
Div de test 1
</span>
<br/>
<span id="truc2" class="myClass">
Div de test 2
</span>
<br/>
<button onclick="testCss('truc1','color');testCss('truc2','color');">Cliquer pour tester</button>
</body>
</html>
;-)
HackTrack
Pour lire ou modifier les propriétés CSS inline ou d'une feuille externe, pour FireFox, Internet Explorer, Safari, Opera, voir ce site : http://www.quirksmode.org/dom/w3c_css.html (mise à jour 02/02/2009).
En résumé :
- Accès/modification des styles inline
IE, opera : x.currentStyle
IE : window.getComputedStyle(x,null).color
W3C : x.style
- Accès aux styles des feuilles de styles
FF, opera : document.styleSheets[1].cssRules[1]
IE : document.styleSheets[1].imports
safari : document.styleSheets[1].rules[1]
document.styleSheets[1]
- Modification des sytles des feuilles de styles
IE, safari : document.styleSheets[1].addRule('pre', 'font: 14px verdana')
FF, safari, opera : document.styleSheets[1].deleteRule(1)
var x = document.styleSheets[1];
x.insertRule('pre {font: 14px verdana}',x.cssRules.length)
document.styleSheets[1].removeRule(1)
- Propriétés
x.style.cssText
document.styleSheets[1].cssText
document.styleSheets[1].cssRules[1].cssText
document.styleSheets[1].cssRules[1].style.cssText
document.styleSheets[1].disabled = true
document.styleSheet[0].href
document.styleSheets[1].cssRules[1].selectorText
- Divers
document.createStyleSheet('extrastyle.css')
document.styleSheets[1].cssRules[1].style.getPropertyPriority('color')
document.getElementById('test').style.getPropertyValue('color')
document.styleSheets[1].cssRules[1].style.getPropertyValue('color')
document.styleSheets[1].ownerNode
document.styleSheets[1].cssRules[1].parentStyleSheet
document.styleSheets[1].cssRules[1].style.removeProperty('color')
document.getElementById('test').style.removeProperty('color')
x.style.setProperty('color','#00cc00',null)
document.styleSheets[1].cssRules[1].style.setProperty('color','#00cc00',null)
En résumé :
- Accès/modification des styles inline
IE, opera : x.currentStyle
IE : window.getComputedStyle(x,null).color
W3C : x.style
- Accès aux styles des feuilles de styles
FF, opera : document.styleSheets[1].cssRules[1]
IE : document.styleSheets[1].imports
safari : document.styleSheets[1].rules[1]
document.styleSheets[1]
- Modification des sytles des feuilles de styles
IE, safari : document.styleSheets[1].addRule('pre', 'font: 14px verdana')
FF, safari, opera : document.styleSheets[1].deleteRule(1)
var x = document.styleSheets[1];
x.insertRule('pre {font: 14px verdana}',x.cssRules.length)
document.styleSheets[1].removeRule(1)
- Propriétés
x.style.cssText
document.styleSheets[1].cssText
document.styleSheets[1].cssRules[1].cssText
document.styleSheets[1].cssRules[1].style.cssText
document.styleSheets[1].disabled = true
document.styleSheet[0].href
document.styleSheets[1].cssRules[1].selectorText
- Divers
document.createStyleSheet('extrastyle.css')
document.styleSheets[1].cssRules[1].style.getPropertyPriority('color')
document.getElementById('test').style.getPropertyValue('color')
document.styleSheets[1].cssRules[1].style.getPropertyValue('color')
document.styleSheets[1].ownerNode
document.styleSheets[1].cssRules[1].parentStyleSheet
document.styleSheets[1].cssRules[1].style.removeProperty('color')
document.getElementById('test').style.removeProperty('color')
x.style.setProperty('color','#00cc00',null)
document.styleSheets[1].cssRules[1].style.setProperty('color','#00cc00',null)
Pour lire ou modifier les propriétés CSS inline ou d'une feuille externe, pour FireFox, Internet Explorer, Safari, Opera, voir ce site : http://www.quirksmode.org/dom/w3c_css.html
sixland
Messages postés
36
Date d'inscription
mardi 12 mars 2002
Statut
Membre
Dernière intervention
26 juin 2005
26 juin 2005 à 19:58
26 juin 2005 à 19:58
merci c'est juste ce qu'il me fallait
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Génial plusieurs heures que je cherchais comment modifier la classe d'une div, className n'étant pas référencé dans dreamweaver.