Kann ich das JavaScript in einem SVG-Bild ausführen, das an das DOM mit JavaScript

angefügt wird Ich möchte ein SVG-Bild an meine HTML anhängen und das JavaScript in der SVG ausführen.Kann ich das JavaScript in einem SVG-Bild ausführen, das an das DOM mit JavaScript

Sagen wir, ich möchte this image holen und sie in meine HTML mit etwas fallen wie:

<!DOCTYPE html> 
<html> 

<head> 
    <title>Test SVG</title> 
    <script type="text/javascript"> 
     var listener = function(response) { 
      document.getElementById('output').innerHTML = this.responseText; 
     }; 
     var request = new XMLHttpRequest(); 
     request.addEventListener('load', listener); 
     request.open('GET', 'https://cdn.rawgit.com/jormaturkenburg/42bf377e390839b6fd75745403fface7/raw/4c851457ae03f0b416d122b7538bc6d9dc794954/circle.svg'); 
     request.send(); 
    </script> 
</head> 
<body> 
    <div>Hello world!</div> 
    <div id="output"> 
     Inner HTML 
    </div> 
</body> 
</html>

Fiddle

Das SVG-Bild hat eine console.log() und eine Warnung() in seinem Skript-Tag. Diese werden beim Anzeigen des Bilds ordnungsgemäß ausgeführt, nicht jedoch beim Anhängen des Bilds an den HTML-Code durch JavaScript. Gibt es eine Möglichkeit, dies zu tun und JavaScript ausführen zu lassen?

Ich weiß, dass sie ausgeführt werden, wenn ich das Bild einbetten sollte, aber ich muss es mit JavaScript inline.

Quelle

2017-01-24 Jorma Turkenburg

@RobertLongson, das JavaScript ist in einem Skript-Tag innerhalb des SVG-Bildes. Wie komme ich dazu? Wenn Sie sich die Quelle von [diesem Bild] ansehen (https://rawgit.com/jormaturkenburg/42bf377e390839b6fd75745403fface7/raw/4272d10bd974f646e2400d4c7e5d31ab7b6ded5a/circle.svg). Es gibt einen Funktionstest. Der Aufruf von test() auf der Seite nach dem Laden des SVG gibt mir einen Fehler. Gibt es einen anderen Weg, um zu dieser Funktion zu gelangen? –

Das ist meine Frage. Wie komme ich dazu? Ich habe versucht, test() im globalen Bereich aufrufen, aber das funktioniert nicht. Ich kann auf das SVG-Objekt zugreifen, nachdem es als innerHTML auf das #Ausgabe-div gesetzt wurde, aber was dann? –

Nach dem Duplikat habe ich diese Frage verlinkt. –

<body>  
<object id="svgholder" data="some.svg" type="image/svg+xml""></object> 
</body> 


var svgholder = $('body').find("object#svgholder"); 

svgholder.load("image/svg+xml", function() { 
    alert("some svg loaded"); 
});

Quelle

2017-01-24 09:20:26 anshuVersatile

Während dieses Code-Snippet die Frage lösen kann, hilft [einschließlich einer Erklärung] (// meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers) wirklich, die Qualität Ihres Posts zu verbessern. Denken Sie daran, dass Sie die Frage für Leser in der Zukunft beantworten, und diese Leute könnten die Gründe für Ihren Codevorschlag nicht kennen. Bitte versuchen Sie auch nicht, Ihren Code mit erklärenden Kommentaren zu füllen, dies reduziert die Lesbarkeit sowohl des Codes als auch der Erklärungen! – kayess

Kann ich das JavaScript in einem SVG-Bild ausführen, das an das DOM mit JavaScript

Antwort

Verwandte Themen