style.displayがうまくいかないようです。

Question

私は特定の要素を隠したり表示したりしようとしています。親要素で行い、子要素ではできません。誰がなぜこれが起こるのか知っていますか？

const ulList = document.querySelector('ul'); 
const studentList = ulList.querySelectorAll('li'); 

ulList.style.display = 'none'; // (when I do it like this, everything is fine). 

studentList.style.display = 'none'; // (but if I do it like these, the error "Uncaught TypeError: Cannot set property 'display' of undefined" appears on the console) 

ありがとうございました！

Answer 1

querySelector()は最初に一致する単一要素だけを返しますが、querySelectorAll()はリストを返します。すべてのリストアイテムにスタイルを適用する必要があります。 次のように試してみてください。

const studentList = document.querySelectorAll('li'); 

studentList.forEach(function(li){ 
    li.style.display = 'none'; 
}); 

Answer 2

を私はあなたが言うことだ...しかし、私は（ループ内でも）このようにそれを行う理由ときに、「ブロック」に表示プロパティが有効になりません。 。通訳者は無視します。

const ulList = document.querySelector('ul'); 
const studentList = document.querySelectorAll('li'); 

ulList.style.display = 'none'; 

for (let i = 0; i < studentList.length; i += 1) { 
    if ((i + 1) >= numPage && i < y) { 
     studentList[i].style.display = 'block'; 
    } 
} 

条件には注意しないでください。それは私のコードの一部です。ループと条件付き実行、0インデックスの最初の要素がブロックプロパティを受け取ると、nothingsが発生します。