Când utilizați inline , toate elementele se află în DOM, la fel ca s și s și orice alt element HTML.
Dacă aveți SVG ca:
si tu faci:
var rect = document.getElementById("foo");veți obține o referință la asta .
Și nu numai asta, puteți atașa ascultători de evenimente care funcționează exact așa cum v-ați aștepta. Și puteți ajusta atributele și orice altceva vă așteptați să puteți face cu JavaScript.
Totuși, există cel puțin un gotcha care mă are. Atasăm adesea ascultători de evenimente la linkuri, stil de îmbunătățire progresivă. În arhitectura JavaScript non-trivială, este probabil ca acei ascultători de evenimente să transmită evenimentul către alte funcții care gestionează funcționalitatea. Se bazează pe thiscuvântul cheie în aceste situații devine dificil și adesea nu este recomandat. În schimb, din moment ce aveți event, puteți utiliza event.target. Acest lucru poate fi la fel de dificil, de vreme ce, cu SVG în linie, ținta ar putea fi legătura, elementul SVG în sine sau oricare dintre formele SVG.
Soluția este de a parcurge înapoi DOM-ul într-un loc așteptat. Sau încercați să evitați situația cu:
svg ( pointer-events: none; )Ceea ce v-aș recomanda dacă nu intenționați să folosiți interactivitatea în SVG.