クラスから継承した要素スタイルを取得する*スタイル属性ではない

Question

スタイルシート/スタイルタグから適用されているdivのスタイルを取得して、要素スタイルをプログラムで無視するにはどうすればよいですか？

var alice = 'alice ' + $('.alice').css('color'); 
 
var boblice = 'alice ' + $('.bob').css('color'); 
 
var bob = 'bob ' + $('.bob').css('color'); 
 

 
$('#result').text(
 
alice + '\n' + bob 
 
); 
 

 
$('#expected').text(
 
boblice + '\n' + bob 
 
); 
 

 
var elem1 = document.getElementById("alice"); 
 
alicestyle = window.getComputedStyle(elem1, null); 
 

 
console.log(alicestyle);

.alice { 
 
    color:green; 
 
} 
 

 
.bob { 
 
    color:green; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id='alice' class="alice" style="color:red"> 
 
test 
 
</div> 
 

 
<div id = 'bob' class="bob"> 
 
test 
 
</div> 
 

 
result: 
 
<div id="result"> 
 

 
</div> 
 

 
expected: 
 
<div id="expected"> 
 

 
</div> 
 

 
getComputedStyle: 
 
<div id="computed"> 
 

 
</div>

---

Answer 1

まあ、私はあなたがスタイルシートから直接スタイルを得ることができるとは思いません。しかし、私はあなたがこの問題を回避するためのコードの下に使用することができると思う：

if(typeof($('#alice').attr('style')) != 'undefined') { 
    $('#alice').removeAttr('style'); 
    var aliceSheets = $('.alice').css('color'); 
    console.log(aliceSheets); 
} 

あなたが唯一の要素のスタイルを変更することなく、スタイルを取得したい場合、あなたは色を読んだ後、バックstyle属性を追加することができます。