Как Вы читаете значения правила CSS с JavaScript?
jsonVariable = {}
for(i=1; i<3; i++) {
var jsonKey = i+'name';
jsonVariable[jsonKey] = 'name1'
}
это будет похоже на
jsonVariable = {
1name : 'name1'
2name : 'name1'
}
5 ответов
Адаптированный от здесь , основываясь на ответе scunliffe:
function getStyle(className) {
var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
for (var x = 0; x < classes.length; x++) {
if (classes[x].selectorText == className) {
(classes[x].cssText) ? alert(classes[x].cssText) : alert(classes[x].style.cssText);
}
}
}
getStyle('.test');
Некоторые различия в браузере для знания:
, Учитывая CSS:
div#a { ... }
div#b, div#c { ... }
и пример данного InsDel, классы будут иметь 2 класса в FF и 3 класса в IE7.
Мой пример иллюстрирует это:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style>
div#a { }
div#b, div#c { }
</style>
<script>
function PrintRules() {
var rules = document.styleSheets[0].rules || document.styleSheets[0].cssRules
for(var x=0;x<rules.length;x++) {
document.getElementById("rules").innerHTML += rules[x].selectorText + "<br />";
}
}
</script>
</head>
<body>
<input onclick="PrintRules()" type="button" value="Print Rules" /><br />
RULES:
<div id="rules"></div>
</body>
</html>
//работает в IE, не уверенном в других браузерах...
alert(classes[x].style.cssText);
Я столкнулся с той же проблемой. И с помощью парней я предложил действительно умное решение, которые решают ту проблему полностью (работавший хром).
Извлечение все изображения из сети
function AllImagesUrl (domain){
return performance.getEntries()
.filter( e=>
e.initiatorType == "img" &&
new RegExp(domain).test(e.name)
)
.map( e=> e.name.replace('some cleaning work here','') ) ```
Я сделал похожую вспомогательную функцию.
которая показывает ненужные стили для этой страницы. добавляет (для использования с консолью firebug)(function getStyles(){var CSSrules,allRules,CSSSheets, unNeeded, currentRule;
CSSSheets=document.styleSheets;
for(j=0;j<CSSSheets.length;j++){
for(i=0;i<CSSSheets[j].cssRules.length;i++){
currentRule = CSSSheets[j].cssRules[i].selectorText;
if(!document.querySelectorAll(currentRule).length){
unNeeded+=CSSSheets[j].cssRules[i].cssText+"<br>";
}
}
}
docBody=document.getElementsByTagName("body")[0];
allRulesContainer=document.createElement("div");
docBody.appendChild(allRulesContainer);
allRulesContainer.innerHTML=unNeeded+isHover;
return false
})()