30.04.2015, 13:46
|
|
Аспирант
|
|
Регистрация: 30.04.2015
Сообщений: 87
|
|
|
узнать css значения класса
допустим есть css класс:
<style>
.MyClass {color:green; width:200px; height:100px;}
</style>
этот класс не присвоен ни одному элементу.
могу я при помощи jquery узнать css значения этого класса?
метод .css() позволяет получить фактические css значения у выбранных элементов, а мне надо у класса. |
|
30.04.2015, 14:16
|
 |
Профессор
|
|
Регистрация: 07.03.2011
Сообщений: 1,138
|
|
|
Что мешает создать новый элемент и присвоить ему класс ?
Этот новый элемент даже в документ выводить не обязательно.
|
|
30.04.2015, 18:04
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,121
|
|
|
css поиск правил для класса
winch,
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
.fon {
color:blue;
}
</style>
<style type="text/css">
.MyClass {color:green; width:200px; height:100px;margin-left: 3px;}
</style>
</head>
<body>
<span class="fon" onclick="alert(JSON.stringify(pusk('.MyClass')))">click me</span>
<script>
function pusk(k) {
for (var e = {}, f = document.styleSheets, c = 0; c < f.length; c++)
for (var a = f[c].cssRules, b = 0; b < a.length; b++)
if (a[b].selectorText == k)
for (var g = a[b].cssText.match(/[-\w]+(?=:)/g) || [], d = 0; d < g.length; d++) {
var h = g[d],
l = h.replace(/-(\w)/g, function(b, a) {
return a.toUpperCase()
});
e[h] = a[b].style[l] }
return e
};
</script>
<style type="text/css">
.MyClass { cursor: pointer; background-color: #00FF00;}
</style>
</body>
</html>
Последний раз редактировалось рони, 02.05.2015 в 20:30.
|
|
30.04.2015, 23:19
|
|
Аспирант
|
|
Регистрация: 30.04.2015
Сообщений: 87
|
|
Сообщение от MallSerg
|
Что мешает создать новый элемент и присвоить ему класс ?
Этот новый элемент даже в документ выводить не обязательно.
|
если не выводить в документ, то высота и ширина будут нулями. а если выводить, то это испортит дизайн.
гмммм.... хотя, как вариант можно конечно вывести за пределами видимой области. ну если более замороченного решеия не найду, наверно так и сделаю. |
|
30.04.2015, 23:28
|
|
Аспирант
|
|
Регистрация: 30.04.2015
Сообщений: 87
|
|
рони, спасибо!
я не понял как - но работает )
а я, по инерции мышления, решение через jquery искал. |
|
02.05.2015, 13:30
|
|
Аспирант
|
|
Регистрация: 30.04.2015
Сообщений: 87
|
|
|
рони, просьба помочь еще раз.
дело в том, что как показала практика, вышеприведенная функция некорректно работает с css свойствами, в имени которых содержится дефис (например: margin-left) - возвращает undefined.
как это пофиксить?
|
|
02.05.2015, 13:37
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,121
|
|
|
Сообщение от winch
|
|
как это пофиксить?
|
не торопится и смотреть на надпись внизу кода
|
Сообщение от рони
|
|
Последний раз редактировалось
|
было исправлено тогда-же сейчас добавил для теста margin-left |
|
02.05.2015, 18:54
|
|
Аспирант
|
|
Регистрация: 30.04.2015
Сообщений: 87
|
|
|
ааа. значит не кросбраузерно это.
в хроме при нажатии "click me" получаю так:
{"color":"green","width":"200px","height":"100px", "margin-left":"3px","cursor":"pointer","backgroud-color":"rgb(0,255,0)"}
а в опере и лисе так:
{"color":"green","width":"200px","height":"100px", "cursor":"pointer"}
|
|
02.05.2015, 20:31
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,121
|
|
|
winch,
проверьте ещё один вариант - пост 3
|
|
02.05.2015, 22:29
|
|
Аспирант
|
|
Регистрация: 30.04.2015
Сообщений: 87
|
|
О! теперь все ОК во всех браузерах.
еще раз, спасибо большое  |
|
|
|
