如何使用JavaScript更改li元素上的innerText

Question

此代码在浏览器加载后。我需要将li类buddyName - “Strider”更改为“Aragon”。

<script src="./scripts/fellowship.js"></script> 
<main> 
    <section id="Middle-Earth"> 
     <article class="the-shire">...</article> 
     <article class="rivendell"> 
      <h1>Rivendell</h1> 
      <aside> 
       <ul id="myBuddy"> 
        <li class="buddyName">Gandalf the Grey</li> 
        <li class="buddyName">Legolas</li> 
        <li class="buddyName">Gimli</li> 
        <li class="buddyName">Strider</li> 
        <li class="buddyName">Boromir</li> 
       </ul> 
      </aside> 
     </article> 
     <article class="morder">...</article> 
    </section> 
</main> 

这是我最近一次尝试，但不工作：

document.querySelectorAll('buddyName'[3]).innerHTML = "Aragorn"; 

Answer 1

你会使用getElementsByClassName让所有li标签。下一步是选择数组的第四个元素并更改值。

document.getElementsByClassName('buddyName')[3].innerHTML= "Aragorn";