Javascript JS排序表-排序指示器

我用一个排序函数构建了这个表，现在我还尝试为所选的

th

设置一个类，这样我就可以放置一些带有CSS的箭头，作为排序指示器

我需要一种方法来将dynamic.asc和.desc类设置到我选择的

th

，在我的

sortTable（）上的某处使用JS。。
它还需要是纯JS


var myData，asc={'userId'：true，'id'：true，'title'：true，'completed'：true}；
var myRequest=new XMLHttpRequest（）；
myRequest.open（'GET'，'https://jsonplaceholder.typicode.com/todos');
myRequest.onload=函数（）{
myData=JSON.parse（myRequest.responseText）；
数据表（myData）；
};
myRequest.send（）；
函数数据表（数据）{
如果（data.length>0）{
var temp=“”；
data.forEach（（u）=>{
温度+=''；
temp+=“”+u.userId+“”；
温度+=“”+u.id+“”；
温度+=''+u.title+''；
温度+=“”+u.completed+“”；
温度+=“”+“”+“”；
document.getElementById（'data'）。innerHTML=temp；
});
} 
}
函数可排序（col）{
myData.sort（函数（a，b）{
if（asc[col]）{
返回a[col]>b[col]？1:-1；
}
否则{
返回a[col]>b[col]？-1:1；；
}
});
asc[col]=！asc[col]；
document.getElementById（'data'）。innerHTML=''；
数据表（myData）；
}
.container{
显示器：flex；
利润率：25px 10px；
}
.我的桌子{
边界塌陷：塌陷；
字号：0.9em；
字体系列：无衬线；
最小宽度：400px；
盒影：0.20px rgba（0,0,0,0.15）；
右边距：15px；
}
.我的桌子{
填充：12px 15px；
}
.我的桌子{
背景色：#009879；
颜色：#ffffff；
文本对齐：左对齐；
}
.我的桌子{
背景色：#009879；
颜色：#ffffff；
文本对齐：左对齐；
光标：指针；
}
.我的桌子{
边框底部：1px实心#dddddd；
}
t车身变速器输入{
宽度：50px；
}
.my table tbody tr:n类型（偶数）{
背景色：#F3；
}
.my table tbody tr：最后一种类型{
边框底部：2个实心#009879；
}

用户ID
身份证件
标题
完成
行动
我已经编辑了剪下的部分。单击
时将显示箭头按钮，其他标题上的图标将被删除


var myData，asc={'userId'：true，'id'：true，'title'：true，'completed'：true}；
var myRequest=new XMLHttpRequest（）；
myRequest.open（'GET'，'https://jsonplaceholder.typicode.com/todos');
myRequest.onload=函数（）{
myData=JSON.parse（myRequest.responseText）；
数据表（myData）；
};
myRequest.send（）；
函数数据表（数据）{
如果（data.length>0）{
var temp=“”；
data.forEach（（u）=>{
温度+=''；
temp+=“”+u.userId+“”；
温度+=“”+u.id+“”；
温度+=''+u.title+''；
温度+=“”+u.completed+“”；
温度+=“”+“”+“”；
document.getElementById（'data'）。innerHTML=temp；
});
} 
}
函数可排序（列，e）{
myData.sort（函数（a，b）{
if（asc[col]）{
返回a[col]>b[col]？1:-1；
}
否则{
返回a[col]>b[col]？-1:1；；
}
});
asc[col]=！asc[col]；
document.getElementById（'data'）。innerHTML=''；
数据表（myData）；
var currentTarget=e.currentTarget；
from（currentTarget.parentElement.children）.forEach（函数（ele）{
ele.classList.remove（'asc'，'des'）；
})
如果（！asc[col]）{
currentTarget.classList.add（'asc'）；
}否则{
currentTarget.classList.add（'des'）；
}
}
.container{
显示器：flex；
利润率：25px 10px；
}
.我的桌子{
边界塌陷：塌陷；
字号：0.9em；
字体系列：无衬线；
最小宽度：400px；
盒影：0.20px rgba（0,0,0,0.15）；
右边距：15px；
}
.我的桌子{
填充：12px 15px；
}
.我的桌子{
背景色：#009879；
颜色：#ffffff；
文本对齐：左对齐；
}
.我的桌子{
背景色：#009879；
颜色：#ffffff；
文本对齐：左对齐；
光标：指针；
}
.我的桌子{
边框底部：1px实心#dddddd；
}
t车身变速器输入{
宽度：50px；
}
.my table tbody tr:n类型（偶数）{
背景色：#F3；
}
.my table tbody tr：最后一种类型{
边框底部：2个实心#009879；
}
th{
位置：相对位置；
}
阿斯克：以前，
戴斯：之后{
边框：4px实心透明；
内容：“；
显示：块；
身高：0；
右：5px；
最高：50%；
位置：绝对位置；
宽度：0；
}
阿斯克：以前{
边框底色：#fff；
页边顶部：-5px；
}
戴斯：之后{
边框顶部颜色：#ffff；
}

用户ID
身份证件
标题
完成
行动
此问题似乎不包含问题。。。？这使得你在这个问题上投了2票…奇怪的是你似乎已经问了3次了。。。