Różnica między dwoma stylami elementu z Google Chrome

Question

używam narzędzi programistycznych Google Chrome i jestem stale sprawdzania jednego elementu z innym iz powrotem, aby dowiedzieć się, co może być przyczyną konkretnego problemu stylizacji.

Byłoby miło, aby porównać różnice w stylu między elementu 1 i elementu 2.

Można to zrobić z chromem obecnie lub poprzez obejście? Czy istnieje narzędzie, które może zrobić to, czego szukam?

Aktualny przykładem różnicy stylu jest to, że mam inline H4 następna do AA gdzie pojawia się wyżej w pionowym ustawieniu. Nie szukam rozwiązania w tym pytaniu, ponieważ to rozwiążę.

Answer 1

---

Aktualizacja: W wyniku tej dyskusji, rozszerzenie "CSS Diff" Chrome została stworzona.

---

Wielkie pytanie i fajny pomysł rozszerzenia!

Dowód koncepcji

Jako dowód koncepcji możemy zrobić małą sztuczkę tutaj i uniknąć tworzenia rozszerzenia. Chrome przechowuje wybrane elementy za pomocą przycisku "inspect element" w zmiennych. Ostatnio wybrany element $0, jeden przed, że w $1 itp opierając się na tym, że stworzyliśmy niewielki fragment, który porównuje dwa ostatnie kontrolowane elementy:

(function(a,b){  
    var aComputed = getComputedStyle(a); 
    var bComputed = getComputedStyle(b); 

    console.log('------------------------------------------'); 
    console.log('You are comparing: '); 
    console.log('A:', a); 
    console.log('B:', b); 
    console.log('------------------------------------------'); 

    for(var aname in aComputed) { 
     var avalue = aComputed[aname]; 
     var bvalue = bComputed[aname]; 

     if(aname === 'length' || aname === 'cssText' || typeof avalue === "function") { 
      continue; 
     } 

     if(avalue !== bvalue) { 
      console.warn('Attribute ' + aname + ' differs: '); 
      console.log('A:', avalue); 
      console.log('B:', bvalue); 
     } 
    } 

    console.log('------------------------------------------'); 
})($0,$1); 

jak go używać?

Sprawdź dwa elementy, które chcesz porównać, jeden po drugim i wklej powyższy kod do konsoli.

Wynik