Kada koristite ugrađeni , svi su elementi u DOM-u, baš kao i
s i s i bilo koji drugi HTML element.
Ako imate SVG poput:
a vi radite:
var rect = document.getElementById("foo");
dobit ćete referencu na to .
I ne samo to, možete priključiti slušatelje događaja koji rade baš onako kako biste očekivali. Možete prilagoditi atribute i sve ostalo što biste očekivali da ćete moći raditi s JavaScriptom.
Ipak postoji barem jedna poteškoća koja me uhvatila. Slušatelje događaja često povezujemo s vezama, u progresivnom stilu poboljšanja. U netrivijalnoj JavaScript arhitekturi, vjerojatno oni koji slušaju događaje prosljeđuju događaj drugim funkcijama koje rukuju tom funkcionalnošću. Oslanjanje na this
ključnu riječ u tim je situacijama nezgodno i često se ne preporučuje. Umjesto toga, budući da je imate event
, možete je koristiti event.target
. To može biti podjednako nezgodno, jer s ugrađenim SVG-om cilj može biti veza, sam SVG element ili bilo koji od SVG oblika.
Rješenje je vratiti DOM natrag na očekivano mjesto. Ili pokušajte izbjeći situaciju uopće s:
svg ( pointer-events: none; )
Što bih preporučio ako ne planirate koristiti interaktivnost unutar SVG-a.