Satır içi kullandığınızda , tüm öğeler DOM'da bulunur, tıpkı
s ve s ve diğer HTML öğeleri gibi.
SVG'niz varsa:
ve sende yap:
var rect = document.getElementById("foo");
buna bir referans alacaksınız .
Ve sadece bu değil, beklediğiniz gibi çalışan olay dinleyicileri ekleyebilirsiniz. Ayrıca, öznitelikleri ve JavaScript ile yapmayı beklediğiniz diğer her şeyi ayarlayabilirsiniz.
Yine de beni anlayan en az bir gotcha var. Etkinlik dinleyicilerini genellikle bağlantılara, aşamalı geliştirme stiline ekleriz. Önemsiz olmayan JavaScript mimarisinde, olay dinleyicilerinin olayı, işlevselliği işleyen diğer işlevlere geçirmesi muhtemeldir. this
Bu durumlarda anahtar kelimeye güvenmek zorlaşır ve genellikle önerilmez. Bunun yerine, sahip event
olduğunuz için kullanabilirsiniz event.target
. Yine de, satır içi SVG ile hedef bağlantı, SVG öğesinin kendisi veya herhangi bir SVG şekli olabileceğinden, bu da biraz karmaşık olabilir.
Çözüm, DOM'u beklenen bir yere geri döndürmektir. Veya şunlarla durumdan kaçınmaya çalışın:
svg ( pointer-events: none; )
SVG'nin kendisinde herhangi bir etkileşim kullanmayı planlamıyorsanız bunu tavsiye ederim.