javascript - 如何使用 JavaScript 连接我的 CSS 和 HTML

Question

我必须用 JavaScript 做一些作业。练习是:我们编写了一个名为 ColorClicker 的游戏。很简单。当你赢得这场比赛时，我想在列表中显示 10 个最好的分数。现在我想将这个列表与我的 CSS 连接起来，这样我就可以让它看起来更酷等等。

我的 JS 代码:

function showHighscoreList(topTen) {
    var rank = 1
    topTen.forEach( function(entry) {
        var list = document.getElementById("highscoreList"),
            listElement = document.createElement("li"),
            entryElement = document.createElement("i");
        entryElement.innerHTML = "Platz "+rank+" - Username: " + entry.user + " | Score: " + entry.score;
        rank++;
        list.style.backgroundColor="orange";
        listElement.style.fontSize = "larger";
        listElement.addEventListener("click", onHighscoreListClicked);
        listElement.appendChild(entryElement);
        list.appendChild(listElement);
    });
}

这是我的 HTML 代码:

<div id="highscore">
        <ul id="highscoreList">
        </ul>
</div>

所以，现在我想用 CSS 操作 HTML 元素。我怎样才能做到这一点？

Answer 1

样式表使用 link 标签链接到 HTML 文档，

<link rel="stylesheet" href="path-to-your-file/style.css">