Найдите <a class="button"> элементы, которые не содержат <img>

У меня есть следующая разметка для кнопок (можно изменить, но я действительно не хочу):

<a href="#" class="button">
  Button text
  <img src="someimage.png" />
</a>

Это стиль с использованием CSS, чтобы стать довольно аккуратной кнопкой с иконкой на ней. Я использую jQuery для округления левой части кнопок:

$('a.button').corner('tl bl 10px');

Это работает как шарм. Теперь я хочу также поддерживать кнопки, у которых нет изображений, и поэтому они должны быть закруглены с обеих сторон. Простое округление всех краев для всех кнопок не будет работать, так как закругленные углы плагина рисуют поверх значков.

Итак, я специально ищу селектор, чтобы выбрать <a class="button">, чтобы иметь <img> -child элементы, а другой - <a class="button"> - элементы, у которых нет <img> -child элементы. Это возможно?

Я знаю, что могу изменить класс кнопки в зависимости от того, есть ли у нее изображение внутри, но это просто неправильно.

jquery,html,css,

2

Ответов: 2

12 принят

Вы можете использовать следующие элементы для выбора якорей с / без детского изображения

$('a.button:has(img)')

$('a.button:not(:has(img))')
2

Чтобы выбрать элементы с классом «button», которые содержат элемент img

$('a.button:has(img)').corner('tl bl 10px');

Чтобы выбрать элементы с классом «button», которые не содержат элемент img

$('a.button:not(:has(img))').corner()

Вы могли бы, вероятно, связать эти утверждения в одном для краткости

JQuery, HTML, CSS,
Похожие вопросы
Яндекс.Метрика