High-Tech Santé Médecine Droit-Finances

Bien choisir

son ordinateur portable

Rechercher : dans
Par :

[JAVASCRIPT-DOM] propriété classe CSS

Dernière réponse le 6 mar 2009 à 12:54:05 sixland, le 22 jun 2005 à 12:31:53 
 Signaler ce message aux modérateurs

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 

...
alert (document.getElementById('truc').style.height);
...


sixland

Meilleures réponses pour « [JAVASCRIPT DOM] propriété classe CSS » dans :
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
Javascript - Librairies d'effets pour vos images VoirAu gré de vos explorations du web, vous avez vu de superbes effets de présentation des images. Et ça vous plairaît bien de pouvoir proposer les mêmes à vos visiteurs. Voici quelques solutions en Javascript couplées à des CSS. Elles sont plus...
[Webmaster] Choisir un bon éditeur, les éditeurs à éviter VoirIntroduction I Les éditeurs à éviter I.1 Frontpage I.2 Word I.3 Publisher II Les éditeurs recommandés II.1 Editeurs WYSIWYG II.1.1 Dreamweaver II.1.2 Web Expert II.1.3 Nvu / Kompozer II.1.4 Amaya II.2 Editeurs en mode code
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Positionner des éléments grâce aux CSS VoirIl est possible grâce aux feuilles de style de positionner au pixel près du texte ou des images grâce aux balises et . Cela est possible avec les versions 4 de Netscape et d'Internet Explorer, cependant cette technique reste hasardeuse...
Javascript - L'objet window VoirLes particularités de l'objet window L'objet window est l'objet par excellence dans Javascript, car il est le parent de chaque objet qui compose la page web, il contient donc : l'objet document: la page en elle-même l'objet location: le lieu de...
Posez votre question Répondre

1

HackTrack, le 24 jun 2005 à 13:42:54
  • +10

<!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

   
Répondre à HackTrack

2

sixland, le 26 jun 2005 à 19:58:27

Merci c'est juste ce qu'il me fallait sixland

   
Répondre à sixland

3

survivor, le 2 jun 2008 à 15:26:20

Génial plusieurs heures que je cherchais comment modifier la classe d'une div, className n'étant pas référencé dans dreamweaver.

   
Répondre à survivor

4

GexMole, le 11 fév 2009 à 17:23:58
  • +2

Yop, tout le monde !!

ATTENTION Je viens de tester ce petit script et surprise, il ne marche ni sous IE ni sous FF...

Depuis le tps les choses on bien changés :$

Si qqun a trouvé une solution alternative ^^

   
Répondre à GexMole

5

CSS, le 6 mar 2009 à 12:02:59
  • +3

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

   
Répondre à CSS

6

CSS, le 6 mar 2009 à 12:30:57
  • +3

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.getPropertyPriorit­y('color')

document.getElementById('test').style.getPropertyValue('colo­r')
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('co­lor')
document.getElementById('test').style.removeProperty('color'­)

x.style.setProperty('color','#00cc00',null)
document.styleSheets[1].cssRules[1].style.setProperty('color­','#00cc00',null)

   
Répondre à CSS

7

 GexMole, le 6 mar 2009 à 12:54:05
  • +1

Merci c'est exactement ce qui me falais ^^

   
Répondre à GexMole
Posez votre question Répondre
Ils ont besoin de votre aide