Accéder un élément XML présent comme plugin dans une page HTML
Bonjour,
Dans ma page XHTML j'ai une balise embed qui a comme source un fichier XML pour créer des entités SVG.
Code:
<embed src="image.svg" width="1000" height="1000" type="image/svg+xml" pluginspage="http://www.adobe.com/svg/viewer/install/" />
J'ai donc des éléments SVG comme plugin dans ma page. Je veux accéder à ces éléments SVG et leur associer des événements en l'occurrence l'événement onclick.
Voici le fichier xml (*.svg)
Code:
1
2
3
4
5
6
7
| <?xml version='1.0' standalone='no'?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
<svg style='cursor:crosshair' width='1000' height='1000' version='1.1' xmlns='http://www.w3.org/2000/svg'>
<path fill='lightsteelblue' stroke='midnightblue' stroke-width='5' d='M 10 10 L 10 20 20 20 20 15 Z '/>
<path fill='lightsteelblue' stroke='midnightblue' stroke-width='5' d='M 100 100 L 150 100 200 300 100 350 Z '/>
<path fill='lightsteelblue' stroke='midnightblue' stroke-width='5' d='M 50 500 L 100 650 65 800 20 700 Z '/>
</svg> |
Ce fichier est créé avec PHP suite à des requêtes.
Pour attacher l'événement onclick à l'élément svg, j'ai créé un script JS qui permet d'accéder au document SVG. Le voici :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send();
return xhttp.responseXML;
} |
Ensuite j'accède au SVG dans un script JS
Code:
1
2
| var doc =loadXMLDoc("image.svg");
var svg = doc.getElementsByTagName("svg")[0]; |
Finalement, je traite les instructions à exécuter dans le cas d'un click sur la balise svg (affichée sur ma page)
Code:
svg.addEventListener("click", function() {...},false);
Lorsque je clique sur le svg : RIEN !
Je ne sais pas où est l'erreur ...
