PS: Это чтобы получить стиль, а не установить стиль. Если значение стиля не установлено для элемента, значение по умолчанию, данное браузером, возвращается. (Форум отсортирован)
1. element.style: только значение стиля, написанное в атрибуте стиля в теге элемента, не может быть получено. Атрибут стиля, определенный в <style> </style> и загружен через <link href = "css.css"> не может быть получен.
Кода -копия выглядит следующим образом:
var ele = document.getElementById ('ele');
ele.style.color; // Получить цвет
2. window.getComputedStyle (): он может получить все конечные значения атрибута CSS текущего элемента.
Кода -копия выглядит следующим образом:
window.getComputedStyle ("element", "Pseudo-Class");
Этот метод принимает два параметра: чтобы получить элемент вычисленного стиля и псевдоэлементную строку (например, «до»). Если псевдоэлементная информация не требуется, второй параметр может быть нулевым. Его также можно использовать через document.defaultview.getComputedStyle ("element", "Pseudo-Class");
Кода -копия выглядит следующим образом:
var ele = document.getElementById ('ele');
var styles = window.getComputedStyle (ele, null);
styles.color; // Получить цвет
Вы можете использовать Style.Length для просмотра количества стилей по умолчанию браузера. IE6-8 не поддерживает этот метод, и необходимо использовать следующий метод. Для Firefox и Safari цвет будет преобразован в формат RGB.
3. element.currentStyle: IE предназначен, что возвращает конечное значение атрибута CSS применяемого в настоящее время элемента (включая внешнюю ссылку CSS -файлы, <style> атрибуты, встроенные в страницу и т. Д.).
Кода -копия выглядит следующим образом:
var ele = document.getElementById ('ele');
var styles = ele.currentstyle;
styles.color;
Примечание: для полной границы атрибута и т. Д., То есть возвращает неопределенные. Некоторые другие браузеры возвращают значения, а некоторые не возвращаются, но атрибуты, такие как BorderleftWidth возвращающие значения.
4. GetPropertyValue (): Получите прямое название свойства стиля CSS
Кода -копия выглядит следующим образом:
var ele = document.getElementById ('ele');
window.getComputedStyle (ele, null) .getPropertyValue ('color');
Примечание. Имя атрибута не поддерживает формат верблюда, IE6-8 не поддерживает этот метод, поэтому требуется следующий метод
5. getAttribute (): аналогично GetPropertyValue, одно отличие - это формат верблюда имени свойства
Кода -копия выглядит следующим образом:
var test = document.getElementbyId ('test');
window.getComputedStyle (тест, null) .getPropertyValue ("founalColor");
Примечание. Этот метод поддерживает только IE6-8.
Следующий метод получения стиля совместим с IE, Chrome, Firefox и т. Д.
Кода -копия выглядит следующим образом:
функция getStyle (ele) {
var style = null;
if (window.getComputedStyle) {
style = window.getComputedStyle (ele, null);
}еще{
style = ele.currentStyle;
}
Стиль возвращения;
}
В JQUERY CSS () обычно используется для получения свойств стиля, а его основная операция применяет методы GetComputEdStyle и GetPropertyValue.