Question

我的解决方案：https://jsfiddle.net/thecodesalim/dsvgdkks/2/

HTML：

<div id=leaderboard class="panel hidden">
  <h1>Leaderboard</h1>
  <ol id=top10>
    <li>Jyn Erso</li>
    <li>Mon Mothma</li>
    <li class="me">Han Solo</li>
    <li>Galen Erso</li>
    <li>Thane Kyrell</li>
    <li>Norra Wexley</li>
    <li>Ciena Ree</li>
    <li>Malakili</li>
    <li>R5-D4</li>
  </ol>
</div>

JS：

function updateLeaderBoard(arr,me){
    let players = document.getElementById("top10");
    for(let i =0; i < arr.length;i++){
        let li = document.createElement("li");
        li.appendChild(document.createTextNode(arr[i]));
        players.append(li);
        if(arr[i].includes(me)) li.classList.add("me");   
   }
}
updateLeaderBoard(["Jack","Robo","Simi"],"Robo");

我希望文本内容只是javascript中的列表，应该替换html列表。感谢

Answer 1

我相信你是说HTML列表是一个占位符，你想清除它并只是从js插入你想要的东西？如果是这样，请在选择时清空<ol>：

let players = document.getElementById("top10");
players.innerHTML = "";

用添加了JS的List替换HTML列表

1 个答案: