Добавление класса к элементу в режиме quirksmode - PullRequest
Новая
       10

Добавление класса к элементу в режиме quirksmode

2 голосов
/ 04 марта 2010

Я пытаюсь добавить класс к элементу td, используя javascript с помощью Internet Explorer 8 в режиме quirks. Кажется, это работает, потому что я вижу добавленный класс при просмотре исходного кода, но мой css не влияет на него, поэтому ничего визуально не меняется. Я просто добавляю html-класс, чтобы изменить цвет фона, но ничего не происходит. Он работает при работе в обычном режиме IE, но это не вариант, поскольку я не могу изменить сайт, и он работает в режиме quirks.

EDIT:

Вот простой пример: 

<html>
<head>
<style>
    .style1 { background-color: #ff0000; }
    .style2 { background-color: #00ff00; }
</style>
</head>
<body>
<table id="table1">
    <tr>
        <td>some text</td>
        <td>goes on</td>
        <td>and on</td>
    </tr>
</table>
<script type="text/javascript">
    var tableElement = document.getElementById("table1");
    tableElement.setAttribute("class", "style1");
</script>
</body>
</html>

Обратите внимание, что он не работает в режиме quirks (протестирован с IE 8), хотя класс добавляется (его можно просмотреть с помощью инструментов разработчика IE)

Ответы [ 2 ]

3 голосов
/ 04 марта 2010

Internet Explorer 7 и ниже (и 8 при эмуляции 7) имеют полностью нарушенную реализацию setAttribute (и getAttribute).

Эффективно это работает так: 

HTMLElement.prototype.setAttribute = function (property, value) {
    this[property] = value;
}

Это прерывается, когда имя свойства и имя атрибута не совпадают (например, когда имя свойства является зарезервированным словом (например, классом) или используется для чего-то другого (например, стиля)).

Используйте foo.className = 'bar' вместо foo.setAttribute('class','bar')

1 голос
/ 04 марта 2010

Я придумал систему, которая создает таблицу стилей на основе любых стилей, которые вы хотите добавить к элементу, а затем добавляет ее в HTML. Кажется, он работает практически на всех браузерах, которые я пробовал, включая различные варианты IE. Он не работает с классами, но может легко достичь того, что вы описали выше.

Статья: http://www.4pmp.com/2009/11/dynamic-css-pseudo-class-styles-with-jquery/

...