使用JavaScript / jQuery从Bootstrap CSS获取CSS值？

Question

I want to get the font sizes of headings h1,h2,h3,h4,h5,h6 which are respectively 36px, 30px, 24px, 18px, 14px, 12px respectively [in bootstrap.css] and alert them in the console. The jQuery method I've seen is $('element').css('property') , but this is not working for external css [ie bootstrap.css]. Should I have to include any more lines of code.

Answer 1

$.each(['h1','h2','h3','h4','h5','h6'], function(idx, val){
    console.log($(val).css('font-size') )
});

Answer 2

var stylesheet = document.styleSheets[(document.styleSheets.length - 1)];

for( var i in document.styleSheets ){
     var temp = = document.styleSheets[i];
     if( temp.href && temp.href.indexOf("bootstrap.css") ) {
        stylesheet = temp;
        break;
     }
}
var ruleList = stylesheet.cssRules, allRules = [];
for (var rule = 0; rule < ruleList.length; rule ++){
   allRules.push( [rule, ruleList[rule].selectorText] );
}
console.log(addRules);