Get first level li from ul

Question

I thought this must be easy but couldn't find a way to get the first level <li> elements. I've tried like so:

 var elements = document.querySelectorAll('ul > li'); console.log(elements); 

 <ul> <li>A</li> <li>B</li> <li> C <ul> <li>C1</li> <li>C2</li> <li>C3</li> </ul> </li> <li>D</li> <li>E</li> </ul> 

But that gives me all <li> elements including C1, C2 etc.

I would like to get only the elements

  <li>A</li>
  <li>B</li>
  <li>C</li>
  <li>D</li>
  <li>E</li>

How to achieve that with vanilla javascript? Please no jQuery

Answer 1

给外部<ul>一个标识符（或类）并使用ul#myId > li （或ul.myId > li ）选择它们或者只是指明你不是指任何其他方式的内部ul，例如body > ul > li 。