Javascript 如何对元素重新排序'；基于他们的价值观的内容？第一名、第二名等

我正在创建一个页面，你可以查看NFL排名。假设包装工有（2,0）个记录，维京人有（1,1）个记录。如果维京人赢了接下来的2场，而包装工输了接下来的2场，那么维京人现在应该是第一名了。 我有改变球队记录的按钮，但是有没有办法让他们在赢的最多的时候升到第一名，输的时候降到第一名，等等？ 如果一支球队排在最后，而我一直点击“W”（代表胜利），我希望他们能够超越其他获胜较少的球队，排在图表的顶部。谢谢

var-winpacker=0；
var-losepacker=0；
var-winviking=0；
var loseviking=0；
var-winbear=0；
var=0；
var-winlion=0；
var=0；
//包装工
document.getElementById（'packerW'）。innerHTML=winpacker；
document.getElementById（'packer'）。innerHTML=losepacker；
函数winPacker（）{
document.getElementById（'packerW'）。innerHTML=winpacker++；
}
函数封装器（）{
document.getElementById（'packer'）.innerHTML=losepacker++；
}
//维京人
document.getElementById（'vikingW'）。innerHTML=winviking；
document.getElementById（'vikingL'）。innerHTML=loseviking；
函数winViking（）{
document.getElementById（'vikingW'）。innerHTML=winviking++；
}
维京函数（）{
document.getElementById（'vikingL'）。innerHTML=loseviking++；
}
//承载
document.getElementById（'bearW'）。innerHTML=winbear；
document.getElementById（'bearL'）。innerHTML=losebear；
函数winBear（）{
document.getElementById（'bearW'）。innerHTML=winbear++；
}
函数loseBear（）{
document.getElementById（'bearL'）。innerHTML=losebear++；
}
//狮子
document.getElementById（'lionW'）。innerHTML=winlion；
document.getElementById（'LionL'）。innerHTML=loselion；
函数winLion（）{
document.getElementById（'lionW'）。innerHTML=winlion++；
}
函数loseLion（）{
document.getElementById（'LionL'）。innerHTML=loselion++；
}

包装工（0,0）
维京人（0,0）
熊（0,0）
狮子（0,0）

干：不要重复你自己

这是一个完整的脚本

• 使用基于对象的脚本生成HTML
• 将事件侦听器添加到容器
• 按胜利排序

const results={
包装工：{赢：1，输：1}，
维京人：{赢：1，输：1}，
熊：{赢：1，输：1}，
狮子队：{赢：1，输：1}
}
常量renderUL=（）=>{
players.innerHTML=“”；
Object.keys（results）.sort（（a，b）=>results[b].win-results[a].win）
.forEach（键=>{
常量html=[]；
html.push（`
${key}:（${results[key].win}，${results[key].lose}）`）
html.push（``）
html.push（`
`）
players.innerHTML+=html.join（“”）；
});
}
addEventListener（“加载”，function（）{//当页面加载时
const players=document.getElementById（“players”）；
renderUL（）；//初始化UL
players.addEventListener（“单击”，函数（e）{//单击UL中的任意内容
常数tgt=e.target；
如果（tgt.classList.contains（“play”）{//这是一个按钮
const wl=tgt.value==“W”？“赢”：“输”；//赢还是输？
results[tgt.name][wl]+；//例如，results[“packer”][“win”]
renderUL（）；
}
})
})

.name{
文本转换：大写
}
#球员{
列表样式类型：无；
}

---

干：不要重复你自己

这是一个完整的脚本

• 使用基于对象的脚本生成HTML
• 将事件侦听器添加到容器
• 按胜利排序

const results={
包装工：{赢：1，输：1}，
维京人：{赢：1，输：1}，
熊：{赢：1，输：1}，
狮子队：{赢：1，输：1}
}
常量renderUL=（）=>{
players.innerHTML=“”；
Object.keys（results）.sort（（a，b）=>results[b].win-results[a].win）
.forEach（键=>{
常量html=[]；
html.push（`
${key}:（${results[key].win}，${results[key].lose}）`）
html.push（``）
html.push（`
`）
players.innerHTML+=html.join（“”）；
});
}
addEventListener（“加载”，function（）{//当页面加载时
const players=document.getElementById（“players”）；
renderUL（）；//初始化UL
players.addEventListener（“单击”，函数（e）{//单击UL中的任意内容
常数tgt=e.target；
如果（tgt.classList.contains（“play”）{//这是一个按钮
const wl=tgt.value==“W”？“赢”：“输”；//赢还是输？
results[tgt.name][wl]+；//例如，results[“packer”][“win”]
renderUL（）；
}
})
})

.name{
文本转换：大写
}
#球员{
列表样式类型：无；
}

---

您的方法应该是通过Javascript填充HTML。我相信可能有一种更有效的方法，但下面的方法应该可以


let记录=[
{
名称：'包装工'，
胜利：1，
损失：0，
},
{
名字：'熊'，
胜利：1，
损失：0，
},
{
名字：“维京人”，
胜利：0，
损失：0，
}
];
函数addWin（i）{
记录[i].wins++；
可生成（）；
}
函数addLoss（i）{
记录[i].损失++；
可生成（）；
}
函数generateTable（）{
//按wins排序
sort（函数（a，b）{返回a.wins-b.wins}）；
记录。反向（）；
document.getElementById（'table'）。innerHTML=''；
for（设i=0；i`
}
}
可生成（）
您的方法应该是通过Javascript填充HTML。我相信可能有一种更有效的方法，但下面的方法应该可以


let记录=[
{
名称：'包装工'，
胜利：1，
损失：0，
},
{
名字：'熊'，
胜利：1，
损失：0，
},
{
名字：“维京人”，
胜利：0，
损失：0，
}
];
函数addWin（i）{
记录[i].wins++；
可生成（）；
}
函数添加