alexalexes

<h4 class="im-page--history-new-bar _im_unread_bar_row">
:before
<span>Новые сообщения</span>
:after
</h4>

<style>
    div.container
    {
      display: flex;
      flex-wrap: wrap;
      width: 770px;
      height: 90px;
      background-color: green;
      overflow: hidden;
    }
    div.container > div
    {
      width: 60px;
      height: 25px;
      background-color: #df1245;
      text-align: center;
      margin: 5px;
      padding: 5px 0;
    }
    div.container > div:nth-child(n + 22) /*этим селекторам задаем свойство сортировки элементам, которые идут после кнопки "показать еще" если контейнер будет адаптивным, придется прописывать кучу вариантов nth-child */
    {
      order: 2;
    }
    div.container > label.more
    {
      display: block;
      width: 130px;
      height: 25px;
      margin: 5px;
      padding: 5px 0;
      text-align: center;
      order: 1; /* У кнопки стоит такой индекс сортировки чтобы оказаться между видимыми и невидимыми элементами */
      background-color: #78d412;
    }
    div.container label.more span.less
    {
      display: none;
    }
    #show-more-state
    {
      display: none;
    }
    #show-more-state:checked ~ div.container
    {
      height: auto;
    }
    #show-more-state:checked ~ div.container label.more
    {
      order: 3;
      margin-left: auto;
    }
    #show-more-state:checked ~ div.container label.more span.more
    {
      display: none;
    }
    #show-more-state:checked ~ div.container label.more span.less
    {
      display: initial;
    }
  </style>
  <input id="show-more-state" type="checkbox"/> <!-- Этим чекбоксом запонимаем состояние кнопки, чтобы можно было оттолкнуться стилями от превдокласса :checked -->
  <div class="container">
    <label class="more" for="show-more-state"><span class="more">ПОКАЗАТЬ ЕЩЕ</span><span class="less">СВЕРНУТЬ</span></label>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
    <div>ITEM</div>
  </div>

let elem_count = elems.length;
for(let i = 0; i < elem_count; i++)
{
  let elem = elems[i];
  // что-то сделать с elem
}

let elem = document.querySelector('.elem'); // Берем нужный контейнер
    elem.addEventListener('click' , function(e) // вешаем обработчик только на elem, за счет всплытия события, обработчик будет срабатывать на всех дочерних элементах
    {
      alert('k');
    });

document.addEventListener('click' , function(e)
    {
      let elem = document.querySelector('.elem');
      if(   e.target == elem // кликнули на сам контейнер elem
         || e.target.tagName == 'SPAN' && e.target.parentNode == elem // или кликнули на какой-то элемент span, непосредственный родитель которого есть наш контейнер elem
        )
      {
        alert('k');
      }
    })

for( let post of _data)
{
  let body = post.body;
  // что-то сделать с body
  for(let block of body.blocks)
  {
    // что-то сделать с block
    for(let curr_data of block.data)
    {
     // что-то сделать с data в block
    }
    // что-то сделать с block
  }
  // что-то сделать с body
}

class DeviceController {
  getItems = async (query)  => {
        let { brandId, typeId, limit, page, } = req.query
        page = page || 1
        limit = limit || 9
        let offset = page * limit - limit
        let devices;
        if (!brandId && !typeId) {
            devices = await Product.findAndCountAll({ limit, offset })
        }
        return devices
    };
    
   getAllForClient = async (req,res) => {
        let newList=[]
        let devices=await this.getItems(req.query)
        for (let index = 0; index < devices.length; index++) {
          let newItem={
              name:devices[index].name,
              price:devices[index].price,
              videoUrl:devices[idnex].videourl            
          }
          newList.push(newItem)        
        }
        return res.json(newList)
    }
}