更新:この議論の結果、 "CSS Diff" Chromeの拡張機能を作成しました。
グレート質問と拡張のためのクールなアイデア!コンセプトの証明として概念
の
証明、我々はここで小さなトリックを行うと拡張子を作成しないようにすることができます。 Chromeは変数の '要素の検査'ボタンを使用して選択した要素を保持します。
(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);
どのようにそれを使用する:この上に基づか$1
などでその前$0
、1の最後の選択された要素は、私は最後の二つの検査の要素を比較して、小さなスニペットを作成しましたか?
比較する2つの要素を順番に調べて、上記のコードをコンソールに貼り付けます。
結果
ファンタスティック。フォローアップの質問を投稿しましたhttp://stackoverflow.com/questions/12611440/accessing-chromes-last-inspected-element-being-0-and-1-via-js –
私はこのためにクロムエクステンションを作成したので、私の元の答えが更新されました。 –
@KonradDzwinel私はあなたに+10を与えることができたらいいと思う。すごくかっこいい。 – Geek