DOM özniteliği değişikliği hata ayıklama

Question

Bir şekilde kodumun bir bölümünde, sayfadaki öğelerden biri, almayı beklemediğim bir stil özniteliği alır. Yani, stil = "konum: sabit" alır. Bunu Firebug’de HTML sekmesinde görebiliyorum, ancak kodu bulamıyorum. Uygulama oldukça büyük ve sadece yeri bulmak için tüm kodu arayamıyorum, yanı sıra, birkaç üçüncü taraf kütüphaneleri kullanılıyor (jQuery bunlardan biri).

Yani, benim sorum şu ki, bu tarzın değişmesi ve izinin yakalanması mümkün mü?

Answer 1

Eh, googling ve deney birkaç saat sonra, en iyisi kurulum böyle bir MutationEvent işleyicisi (Firefox bunları destekler) yapabilir gibi görünüyor:

var node_modified = function(evt) { 
    if(evt.attrName == 'style') { 
     alert('Style is changing from ' + evt.prevValue + ' to ' + evt.newValue); 
    } 
} 
var test_close = document.getElementById('test_close'); 
test_close.addEventListener('DOMAttrModified', node_modified, false); 

Bir sonra kurmak kodunuz boyunca bir çeşit kayıt ve bu olayın ne zaman tetiklendiğini görün. Ne yazık ki, mutasyon olay işleyicide bir kesme noktası ayarlayamaz ve yığın izini göremezsiniz, çünkü olay işleyicinin yığın izlemesi, olayın tetiklendiği yerde koddaki yer hakkında hiçbir bilgiye sahip değildir. Mantıksal bir şey, ama bence bu özellik bazı hack ile Firebug'da uygulanabilir.

Zaman ayırdığınız için teşekkür ederiz!

Answer 2

Gerçekten bir hata ayıklayıcısına ihtiyacınız var gibi görünüyor. Firebug has one built in, aksi takdirde biraz daha hantal buluyorum ama belki de daha etkilidir Venkman bir deneyin verebilir.

İyi şanslar! :)

Answer 3

Google Chrome'da, sayfada bir öğeye sağ tıklayın ve "Eleman İnceleyin" i seçin. Geliştirici Araçları penceresi veya bölmesi, kaynak görünümünde seçilen öğe ile açılır. Sonra seçili etiketi sağ tıklayıp "Nitelikler Üzerinde Değişiklikler Yap" seçeneğini belirleyebilirsiniz.

Answer 4

Firebug'un html denetçisinde bir düğüme sağ tıklayabilirsiniz ve öznitelik değişikliğini kesmek için bir seçenek vardır.

Kesme noktaları, sayfa yeniden yükleme yoluyla devam eder ve ayrıca çağrı yığınına da göz atabilirsiniz.