Acceder aux blocs d'une pseudo classe CSS ?

**Fladnag** · 27/12/2008, 11h28

Bonjour !

Je n'arrive pas a trouver comment faire pour acceder en javascript aux elements de la page définis avec les pseudos classes CSS :before et :after.

Dans l'exemple ci dessous, je créé un div avec une pseudo classe :before qui va etre le titre du div.
J'aimerais ajouter un gestionnaire d'evenement *uniquement* au titre du div, mais je ne vois pas le "block" correspondant au :before dans l'inspecteur DOM.

Est-ce réellement possible ?

(ps : C'est du code compatible FF3, si ca ne fonctionne pas sous IE c'est pas grave ;o)

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
24
25
26
27
28
29
30
31
32
33
34
35
36
<html>
<head>
	<style>
		.cadre {
			width:200px;
			margin:auto;
			border:1px solid;
		}
		.cadre:before {
			display:block;
			content:attr(titre);
			background-color:lightblue;
		}
	</style>
</head>
<body>
	<div id="testDiv" class="cadre" titre="Titre">
		Contenu
	</div>
 
<script>
	function test(e) {
		alert('test');
	}
 
	var aDiv=document.getElementById("testDiv");
	// definition d'un gestionnaire d'evenement sur le div : ok
	aDiv.onclick=test;
	// modification du style du div : ok
	aDiv.style.fontWeight='bold';
	// definition d'un gestionnaire d'evenement uniquement sur le titre du div ?
	//aDiv.???.onclick=...;
</script>
 
</body>
</html>

**Bovino** · 28/12/2008, 15h06

Peut-être :

Code :

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

aDiv.previousSibling

mais non garanti, je ne sais pas trop comment les pseudo-classes sont gérées par le DOM...

**Fladnag** · 28/12/2008, 21h54

ben justement, j'ai l'impression que les pseudos classes ne sont *pas* dans le DOM, je ne pensais pas que c'était possible, mais elles n'apparaissent pas dans l'explorateur DOM de FF3 :/

**le_chomeur** · 29/12/2008, 11h37

en faisant un alert de className de ton objet tu as quoi ??

car les pseudo class sont normalement lié a des évènements donc normal que tu ne les vois pas directement ...

**Fladnag** · 29/12/2008, 11h43

bah, le className me renvoi "cadre", ce qui est correct.
si tu parles du div.previousSibling.className, c'est undefined

J'ai l'impression que ce que je souhaite n'est pas possible... je laisse le thread ouvert si quelqu'un d'autre a une idée ;o)

Acceder aux blocs d'une pseudo classe CSS ?

JavaScript

Discussions similaires

Partager

Partager