Обращение к подэлементу

Есть меню

sidemenu.innerHTML=`<li>
    <div class="leftside">
    <i class="fa fa-home"></i>
    </div>
    <div class="centerplace">
    <a href="" class="nestedblock">Техника для кухни</a>
    </div>
    <div class="rightside">
    <i class="fa fa-home"></i>
    </div>
  </li>
  <li>
    <div class="leftside">
    <i class="fa fa-home"></i>
    </div>
    <div class="centerplace">
    <a href="" class="nestedblock">Бытовая техника для дома</a>
    </div>
    <div class="rightside">
    <i class="fa fa-home"></i>
    </div>
  </li>
  <li>
    <div class="leftside">
    <i class="fa fa-home"></i>
    </div>
    <div class="centerplace">
    <a href="" class="nestedblock">Ноутбуки и компьютеры</a>
    </div>
    <div class="rightside">
    <i class="fa fa-home"></i>
    </div>    
  </li>
  <li>
    <div class="leftside">
    <i class="fa fa-home"></i>
    </div>
    <div class="centerplace">
    <a href="" class="nestedblock">Комплектующие</a>
    </div>
    <div class="rightside">
    <i class="fa fa-home"></i>
    </div>    
  </li>
  </li>`;

Есть элемент этого списка

let elemmenuitemli = document.querySelectorAll('li');
<li>
    <div class="leftside">
    <i class="fa fa-home"></i>
    </div>
    <div class="centerplace">
    <a href="" class="nestedblock">Техника для кухни</a>
    </div>
    <div class="rightside">
    <i class="fa fa-home"></i>
    </div>
  </li>

Каким образом можно обратиться к подэлементам elemmenuitemli - элементам классов .centerplace и .rightside?


Ответы (1 шт):

Автор решения: Макс к

Если говорить, о вашем втором куске кода, то можно добраться до элементов через childNodes и получить коллекцию, в которой li будет первым (нулевым) элементом. После этого, можно получить детей нулевого элемента коллекции, в которой будут нужные вам элементы. Не знаю, то ли это, что вы хотели узнать, но добраться к элементам так можно. let elems = document.querySelectorAll("li");

elems[0].children

HTMLCollection(3) [div.leftside, div.centerplace, div.rightside]

→ Ссылка