Открыть список
Как стать автором
Обновить

Комментарии 15

2. ::pseudoElement
Покажите, пожалуйста, пример как с ними можно работать через jQuery.
Возможно не оно самое, но «select option:selected». Так же :first, :focus
Вовсе не оно. jquery с псвевдоэлементами не работает, на сколько мне известно. В лучшем случае — можно манипулировать со стилями элемента, а уже в зависимости от них изменять псевдоэлемент
Вот именно поэтому я и попросил пример. Я тоже не припомню, чтобы с псевдоэлементами можно было работать через js.
В 6-м пункте надо использовать find вместо filter.
Напомню два интересных варианта добавления, скажем, к ссылкам на pdf-документы соответствующих иконок (здесь сама идея, оформить ссылки, конечно, можно как удобно):

a[type="application/pdf"] { 
  background-image: url(/images/pdf.gif);
  padding-left: 20px;
}

и
a[href$=".pdf"] { 
  background-image: url(/images/pdf.gif);
  padding-left: 20px;
}

Правда, в первом случае речь все же не идет про MIME-type (да и как браузер узнает, какой MIME-type у объекта по невыкачанной еще ссылке?), а именно про ссылки, для которых указан соответствующее значение HTML-аттрибута type:
<a href="/pdf/manual_on_manual.pdf" type="application/pdf">Мануал по пользованию мануалом</a></p>

Польза от такого подхода в том, что не во всех ссылках может быть указано расширение, что не даст выведение иконки по второму из приведенных способов.
Если все-равно нужно подставлять свойство type=«application/pdf», почему просто не подставить class=«link_pdf» и не выдумывать всяких трюков с CSS-селекторами?
[href^="http"]

Eat this:
<a href="//habrahabr.ru">Habrahabr</a>

Пункт номер 1.


Это необязательно и, к тому же, не учитывает ссылки по протоколу https.>
Это неправильно, при данном написании будут учитываться ссылки с https. А вот если написать ```css
href^="https"
то не будут учитываться http

1. [href^=«http»]

не заработает в случае с:
<a href="http://this-site.com/page">page</a>

исправление:
a[href^="http"]:not([href*="this-site.com"])

Первые 4 и 9ый взяты из этого туториала вместе с примерами. Не вижу ссылки на оригинал, да еще и перевод с ошибками: "Обратите внимание, что мы не ищем http" — в оригинале было "http://", а это не имеет смысла.

Все селекторы не входящие в спецификацию CSS, а являющиеся расширениями jQuery, следует использовать с осторожностью, т.к. они могут сильно проседать по производительности. К примеру:
Because :checkbox is a jQuery extension and not part of the CSS specification, queries using :checkbox cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use [type=«checkbox»] instead.


Для наглядности приведенного в пример :checkbox: представим таблицу 200x50, в ячейках которой будут чекбоксы.
//jquery 1.9.1
$('tr input[type="checkbox"]') //в вакууме выполнится ~18-19ms
$('tr input:checkbox') //в вакууме выполнится ~70-80ms
В пункте 6. :header скорее всего должно быть не
$("h1 h2 h3 h4 h5 h6")
а
$("h1, h2, h3, h4, h5, h6")
Всё то же написано в любом учебнике по css, в чём смысл статьи? Ещё и с таким количеством ошибок, как грамматических, так и просто по невнимательности (filter вместо find хотя бы).
Действительно, очень удивительно, что у статьи положительный рейтинг при таком низком её качестве.
Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.