Управление CSS определенного <div>, у которого нет класса или идентификатора

0

Я просто изучаю jQuery и немного запутался в этом:

Скажем, мне нужно предоставить сценарий jQuery, который добавит имя класса 'ourClass' к <div>. Я бы использовал следующий код:

$("div").addClass('ourClass');

Правильно ли это? После того, как я добавлю имя класса в этот конкретный <div> будут ли конфликты позже, если я хочу добавить другое имя класса в другой конкретный <div>?

Базовый вопрос помогает оценить.

  • 0
    нет не будет никаких проблем, что я думаю
  • 1
    это добавит класс ко всем div
Показать ещё 5 комментариев
Теги:
class

4 ответа

1

Селектор JQuery $("div") выберет ВСЕ элементы div на странице. Наверное, не то, что ты хочешь.

Вместо этого посмотрите на родительские элементы и попытайтесь определить селектор, который будет нацелен на соответствующий элемент.

Например...

<header>
  <div>abc</div>
  <div>def</div>
  <div>ghi</div>
</header>
<main>
  <div>jkl</div>
  <div>mno</div>
  <div>pqr</div>
  <ul>
    <li>
      <div>stu</div>
    </li>
  </ul>
</main>

Селекторы:

  • Селектор $("header div") выберет первые три $("header div"). Если вам нужно выбрать только один из них, вы можете использовать $("header div").first(), $("header div").last() или $("header div").eq(1), (eq() будет выбирать по индексу, где индекс первого элемента равен 0).

  • $("main div") выберет последние четыре (любой элемент div, являющийся дочерним элементом main, включая "stu"). Это также эквивалентно $("main").find("div").

  • $("main > div") выберет любой div который является прямым ребенком main ("jkl", "mno" и "pqr", но не "stu"). Это также эквивалентно $("main").children("div").

  • $("main li div") выберет "stu".

Обычно лучше всего просто дать вашим элементам имя класса или идентификатор, если вам нужно настроить таргетинг на них с помощью JQuery, но всегда можно проявлять творческий подход к вашим селекторам, если у вас нет выбора.

0

Как указывает король Кинг, вышеупомянутое может найти каждый div на странице и добавить к нему класс ourClass. Селекторная часть jQuery работает так же, как CSS, поэтому, если бы у вас было правило в вашем CSS, которое было div (background-color: blue;), оно применило бы синий фон к каждому div на странице. Предоставляя более конкретную информацию в своем селекторе, вы можете ограничить или настроить конкретные элементы на странице.

И точно так же, как ваша стандартная надпись может иметь несколько классов для одного элемента, вы можете добавить несколько классов с помощью jQuery.

0

используйте .filter() в соответствии с вашими комментариями:

$('div').filter(function(){
   return $(this).css('height') === '34px'
}).addClass('ourClass');

Вышеприведенный фрагмент кода добавляет ourClass css ourClass класса к div, который имеет высоту 34px.

0

Любые элементы могут иметь любое количество классов. Но такой же идентификатор не должен быть в документе.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню