Auf SVG-Objekt mit Javascript zugreifen
Mathias
- javascript
Hallo
Habe folgendes Problem (hier ein bschen vereinfacht):
In einer HTML-Datei ist eine SVG-Grafik eingebunden mit:
<embed id="svgobjekt" src....>
Im selben Dokument ist ein script, mit dem ich Zugriff auf Elemente in der SVG-Grafik erhalten will, um darin z.b. Attribute eines Texts ändern zu können:
<script type="text/javascript">
function changeColor (){
var svggrafik = document.getElementById("svgobjekt").getSVGDocument();
svggrafik.getElementById("text1").setAttribute('fill','red');
}
</script>
auf die funktion changeColor greife ich aus einem anderen Frame zu:
<frameset onLoad="parent.frames[0].setOnhome()"...
sobald dieses Frameset gelanden wird, wird changeColor() aufgerufen.
Leider bekomme ich immer den Fehler:
getElementById(....) ist Null oder kein Objekt.
(Habe es auch schon mit getElementsByTagName usw versucht, ohne Erfolg)
Vielen Dank schonmal im Vorraus
Hallo,
auf die funktion changeColor greife ich aus einem anderen Frame zu:
<frameset onLoad="parent.frames[0].setOnhome()"...
sobald dieses Frameset gelanden wird, wird changeColor() aufgerufen.Leider bekomme ich immer den Fehler:
getElementById(....) ist Null oder kein Objekt.
(Habe es auch schon mit getElementsByTagName usw versucht, ohne Erfolg)
Vermutlich wird die Funktion aus dem Frame heraus bereits aufgerufen, wenn das SVG-Dokument im anderen Frame noch gar nicht vollstaendig geladen ist, also das embed-Element auch noch nicht im DOM-Baum zur Verfuegung steht.
Stelle mal einen Testcase online. Angaben zu OS, Browser, Plug-In waeren auch nuetzlich.
MfG, Thomas
Betriebssystem: Windwos XP
Browser: IE 6.0
Plug-In: Adobe SVG-Viewer 3.0
Das sind meine 3 Frames:
-----------------------------------------
Frame1:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
</head>
<frameset cols="146,*" border="0" frameborder="0" framespacing="0">
<frame src="svg1024/svgnavileft1024.html" scrolling="no"
name="navileft1024" noresize>
<frameset rows="80,*" border="0" frameborder="0" framespacing="0">
<frame src="svg1024/svgbanner1024.html" scrolling="no" name="banner1024" noresize>
<frame src="svg1024/deu-home/svgdeuhome1024.html" scrolling="no"
name="contents1024" noresize>
</frameset>
</frameset>
</html>
-----------------------------------------
contents1024:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
</head>
<frameset onLoad="parent.frames[0].setColor()" rows="40,*" border="0" frameborder="0" framespacing="0">
<frame src="svgdeuhometitle1024.html" scrolling="no"
name="svghometitle1024" noresize>
<frame src="svgdeuhomecontent1024.html" scrolling="no"
name="svghomecontent1024" noresize>
</frameset>
</html>
-----------------------------------------
navileft1024:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript">
function setColor (){
var svgdoc = document.getElementById("objekt").getSVGDocument();
svgdoc.getElementById("text1").setAttribute('fill','red');
}
</script>
</head>
<body>
<object id="objekt" data="../svg/navibar-left.SVG" width="132" height="445"
style="margin-right:1px; float:left;" type="image/svg+xml">
Kein SVG unterstuetzt.
</object>
</body>
</html>
-----------------------------------------
Kurz:
Im Frame "navileft1024" ist ein SVG-Menue, der Frame wird nie neu geladen, es steht also di eganze Zeit da.
Wird allerdings der Frame contents1024 neu geladen wird die Funktion setColor() aus "navileft1024" aufgerufen.
es erscheint der fehler:
'getElementById(...)' ist Null oder kein Objekt
Verlinke ich den text mit der id "text1" (in der SVG-Grafik)so, dass wenn ich auf ihn klicke, contents1024 aufgerufen wird (sprich neu geladen), so ändert er seine farbe. aber nicht, wenn contents 1024 z.b. durch Aktualisieren aufgerufen wird.
Oder kann es sein, dass beim klicken auf "aktualisieren" das SVG-Element noch nicht zur verfügung steht....
Hallo,
Das sind meine 3 Frames:
Ein Online-Test waere nachvollziehbarer, zumal es Unterschiede beim SVG-Zugriff via http bzw. file gibt.
Oder kann es sein, dass beim klicken auf "aktualisieren" das SVG-Element noch nicht zur verfügung steht....
Klar, kann das sein, wenn das Timing nicht stimmt. Es sollte aber leicht zu testen sein:
if(parent.frames[...].document.getElementById(...))
{
// auf Objekt zugreifen
}
else
{
// Objekt existiert nicht
}
MfG, Thomas
Danke für den Denkanstoß.
Beim Laden der Seite, bzw beim Aktualisieren ist das SVG-Objekt noch nicht verfügbar.
Habe jetzt mit if-Objektabfragen für jedes Objekt geprüft, ob es existiert.... dann bekomme ich keine Fehlermeldung.
Auf jeden Fall danke nochmal :)