Форум

djonA · #1 (**permalink**) 26.02.2018, 01:00

Подскажите как выделить красным цветом все елементы с 3.

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$(document).ready(function(){ 
$('.main').each(function(){
  $('.child', this).each(function(i){
    $(this).addClass('showhide' + (i+1));
  })
});});
</script>

<div class="main">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
<div class="child">4</div>
</div>

<div class="main">
<div class="child">1</div>
<div class="child">2</div>
</div>

Мне надо везде где showhide3 и выше (showhide4,showhide5 и т.д)
добавить: .css('color', 'red');

laimas · #2 (**permalink**) 26.02.2018, 01:07

Не нужно тут цикла, просто селектор класса + :contains(3)

рони · #3 (**permalink**) 26.02.2018, 01:10

djonA,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .main .child:nth-child(n+3) {
    color: red;
  }

  </style>

  </head>

<body>

<div class="main">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
<div class="child">4</div>
</div>

<div class="main">
<div class="child">1</div>
<div class="child">2</div>
</div>

</body>
</html>

laimas · #4 (**permalink**) 26.02.2018, 01:12

рони,
а если не это?

рони · #5 (**permalink**) 26.02.2018, 01:12

laimas,
что не так?

j0hnik · #6 (**permalink**) 26.02.2018, 01:13

сначала тоже про :contains(3) подумал, но потом снизу текст пару раз перечитал.

laimas · #7 (**permalink**) 26.02.2018, 01:15

Сообщение от рони

что не так?

Все так, но может нужно спрятать именно по содержимому.

djonA · #8 (**permalink**) 26.02.2018, 01:15

Спасибо!

djonA · #9 (**permalink**) 26.02.2018, 08:47

А можно как то определять не по порядковому номеру а величине значения.
Если к примеру:

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<style type="text/css">
.showhide {
background: red;
}
</style>
<script>
$(document).ready(function(){ 
$('.main').each(function(){
  $('.child:nth-child(n+3)', this).addClass('showhide');
});

});
</script>

  </head>

<body>

<div class="main">
<div class="child">4</div>
<div class="child">1</div>
<div class="child">3</div>
<div class="child">2</div>
</div>

<div class="main">
<div class="child">1</div>
<div class="child">2</div>
</div>

</body>
</html>

выделить надо не по порядковому номеру, а те div где значение больше 3 (3,4)

рони · #10 (**permalink**) 26.02.2018, 09:02

djonA,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<style type="text/css">
.showhide {
background: red;
}
</style>
<script>
$(document).ready(function(){
$('.main').each(function(){
  $('.child', this).filter(function() {
   return this.textContent - 2 > 0
}).addClass('showhide');
});

});
</script>

  </head>

<body>

<div class="main">
<div class="child">4</div>
<div class="child">1</div>
<div class="child">3</div>
<div class="child">2</div>
</div>

<div class="main">
<div class="child">1</div>
<div class="child">2</div>
</div>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript