jQuery для повторного применения изначально не поддерживаемых правил CSS (например, в IE)

Question

IE8 не поддерживает (например, , но не исключает ) :last-child, поэтому часто я обнаруживаю, что делаю что-то вроде:

/* CSS */
element:last-child,
element.last-child{
    /* properties */
}

/* jQuery */
$('element:last-child').addClass('last-child');

Поскольку jQuery поддерживаетизначально неподдерживаемые селекторы CSS, есть ли способ просто оценить таблицу стилей CSS, и чтобы jQuery ( re- ) применил стили, не прибегая к такой легкомысленной классификации элементов?

Что-то вроде:

$('link[rel="stylesheet"]').each(function(){
    $.reapplyStylesheet($(this).attr('href'));
});

Примечание: Учитывая множество способов реализации CSS, специфичного для браузера, есть с уверенностью еще один (возможно, лучший) способ сделать это, однако мне все еще любопытно.

Answer 1

Modernizr - один из лучших вариантов.Цитирую сайт:

"Использование новых возможностей HTML5 и CSS3 может означать потерю контроля над опытом работы в старых браузерах. Modernizr 2 - ваша отправная точка для создания лучших веб-сайтов и приложений, которые работают точно так же, нетнезависимо от того, какой браузер или устройство используют ваши посетители. "

Используется: twitter, Google, Microsoft и т. д. *

Microsoft даже поставляет версию с MVC 3, я считаю.

Answer 2

Самый простой способ - использовать библиотеку подкладок, такую ​​как IE7-js

Вот список поддерживаемых (отобранных) селекторов в IE7-js .

Answer 3

Любое решение должно было бы сделать то, что вы уже делаете за кулисами.jQuery поддерживает изначально неподдерживаемые селекторы, разделяя их и используя каждую часть селектора для выполнения некоторого обхода DOM - он ничего не делает для того, чтобы браузер мог «понимать»: последний ребенок и т. д.

Этот обход DOM обязательно намного медленнее, чем синтаксический анализ движка CSS и применение дополнительного класса, особенно в браузерах, которые вас интересуют в этом случае.Новые браузеры будут иметь достаточно быстрые JS-движки, чтобы вы не замечали наказания во многих случаях - но эти браузеры в любом случае также поддерживают селекторы CSS3.

Другой камень преткновения заключается в том, что браузеры создаются для игнорирования (недаже попробуй разобрать) CSS правила для селекторов они не понимают.Таким образом, вы должны выполнить весь свой анализ и повторное применение, работая с таблицей стилей в виде большого куска текста - у вас не будет доступа к «нарушенным» правилам с помощью обычных механизмов.

Представьте, что у вас естьсистема, которая:

1. Проверяет все ваши селекторы
2. Выясняет, какие из них не могут использоваться текущим браузером
3. Затем восстанавливает эти селекторы в форматбраузер может использовать
4. Затем переписывает части таблицы стилей для добавления новых селекторов
5. Затем применяет все необходимые хуки для HTML (возможно, добавляя классы, как вы обычно это делаете)

Это, я думаю, основа того, что вам нужно делать, что вы хотите.Это будет медленно - очень медленно - в старых браузерах.Лучше смотреть на это с точки зрения DOM - что-то для автоматического добавления классов (.last-child) и т. Д., Которые вы в настоящее время делаете вручную.

Answer 4

http://selectivizr.com/

selectivizr - это утилита JavaScript, которая эмулирует псевдоклассы CSS3 и селекторы атрибутов в Internet Explorer 6-8.Просто включите скрипт на своих страницах, а selectivizr сделает все остальное.