我正在尝试选择.nav-item类的最后一个子元素，并且已经尝试了几种方法。它不抓取项目，仅返回“ null”，应用样式将抓取第一个项目或返回以下错误：
main.js：25未捕获的TypeError：在main.js：25处无法读取null的属性“样式”
我的代码：
顶部工作正常并且确实应用了边框，但是我想在最后一项的右侧应用边框，在第一项的左侧应用边框。最后一项不起作用。
谁能指出我的错误？HTML可以帮助您：
let items = document.querySelectorAll('.nav-item');
for (let i = 0; i < items.length; i++) {
items[i].style.borderTop = '0.2em solid white';
items[i].style.borderBottom = '0.2em solid white';
}
// First and Last Item
// var secondItem = document.querySelector('.list-group-item:nth-child(2)');
// secondItem.style.color = 'coral';
let lastItem = document.querySelector('.nav-item:nth-child(4)');
console.log(lastItem);
lastItem.style.borderRight = '0.2em solid white';<nav>
<h1>Item Lister</h1>
<ul class="nav" id="list">
<a href="#"><li class="nav-item">One</li></a>
<a href="#"><li class="nav-item">One</li></a>
<a href="#"><li class="nav-item">One</li></a>
<a href="#"><li class="nav-item">One</li></a>
</ul>
</nav>我使用了lastElementChild和firstElementChild选项。这些工作。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句