如何修复JavaScript中的[ObjectHtmlButtoneElement]问题

很抱歉打扰大家。我知道，这个问题已经被问了很多次了。然而，我就是无法解决我的问题

所以，我一直在尝试创建一个网球计分系统，当你点击两个按钮中的一个，赢按钮或输按钮时显示得分。我有一个按钮，他们可以将自己的名字添加到评分系统中。当一名球员赢了两盘，比赛就结束了。然后我试着打印他们的名字，写着“赢了比赛”。当我尝试使用打印其名称的变量时，我得到的结果是：[ObjectHtmlButtoneElement]。我已经尝试了很长时间来解决这个问题，但我不知道如何解决

代码如下：

document.getElementById（“youName”）.onclick=function（）{
var youName=提示（“输入您的姓名”）；
document.getElementById（“youOutput”）.innerHTML=youName+：“；
}
设点=0；
函数win（）{
积分+=1；
document.getElementById（“points”）.innerHTML=points；
如果（点==2）{
document.getElementById（“finish”）.innerHTML=youName+“赢得比赛”；
}
}

你的名字

得分

尝试在全局上下文中声明您的姓名

let yourName = null;
document.getElementById("youName").onclick = function () {
    yourName = prompt("Enter your name");
    document.getElementById("youOutput").textContent = `${yourName}`;
};

let points = 0;

function win() {
    points += 1;
    document.getElementById("points").innerHTML = points;

    if (points == 2) {
        document.getElementById(
            "finish"
        ).textContent = `${yourName} won the match`;
    }
}

---

“我知道，这个问题已经被问了很多次。”-那么，你希望同一问题的

n+1

答案会有什么变化？变量

youName

不在

win（）

函数的范围内，因此，当你尝试执行

youName+“赢得比赛”

时，代码的行为与你预期的不一样。嗨。请注意，这里的答案（和问题）必须是英文的，以便让尽可能多的观众都能理解。编辑，对不起我的疏忽没有什么对不起的：你只需要习惯这里的事情是怎么做的；我们都不得不这么做。顺便说一句，欢迎你将变量移动到全局范围并不是a）答案中的唯一更改，也不是解决此问题的唯一必要更改。这两点都应该在你的答案中解释。那么

document.getElementById（“finish”）.textContent=…

中的这些换行是怎么回事？