思路:首先将html中的tbody表格以对象数组的形式存储起来,即外部结构是数组,内部元素是对象,然后再对数组进行排序即可。首先获取tbody,然后获取tbody中的所有tr,接着获取tr中的所有td,再对td进行处理即可得到对象,再将各个对象加入数组中即可。

<body>
    <table>
    <thead>
        <tr><th>id</th><th>price</th><th>sales</th></tr>
    </thead>
    <tbody id="jsList">
        <tr><td>1</td><td>10.0</td><td>800</td></tr>
        <tr><td>2</td><td>30.0</td><td>600</td></tr>
        <tr><td>3</td><td>20.5</td><td>700</td></tr>
        <tr><td>4</td><td>40.5</td><td>500</td></tr>
        <tr><td>5</td><td>60.5</td><td>300</td></tr>
        <tr><td>6</td><td>50.0</td><td>400</td></tr>
        <tr><td>7</td><td>70.0</td><td>200</td></tr>
        <tr><td>8</td><td>80.5</td><td>100</td></tr>
    </tbody>
    </table>
    <script type="text/javascript">
      function sort(type, order) 
      {
        //将列表存储为对象数组 再利用数组排序
        var tbody = document.getElementById('jsList'); // 获取<tbody>元素
        var rows = tbody.getElementsByTagName('tr'); // 获取所有<tr>元素
        var arr=[]
        for (var i = 0; i < rows.length; i++) 
        {
            var tds = rows[i].getElementsByTagName('td'); // 获取当前行下的所有<td>元素
            // 分别提取每个<td>元素的内容 并转换为数字
            var td1 = Number(tds[0].innerText); // 第一个<td>
            var td2 = Number(tds[1].innerText); // 第二个<td>
            var td3 = Number(tds[2].innerText); // 第三个<td>
            var obj={}
            obj["id"]=td1
            obj["price"]=td2
            obj["sales"]=td3
            //注意这个关键 直接将原数组也作为一个元素 这样排序其他key时 按照key排序后 直接索引tr即可
            obj["tr"]=rows[i]
            arr.push(obj)
        }
        arr.sort(function(a,b){
           if(order==='asc')
             return a[type]-b[type]
           else if(order==='desc')
             return b[type]-a[type]
        })
        tbody.innerHTML = ''
        arr.forEach(item => {
         tbody.appendChild(item["tr"]);
        })
        return arr
      }
      sort('sales','asc')
</script>

总结:注意这个关键,直接将原数组元素tr也作为一个元素存储在对象元素中,这样排序其他key时,按照key排序后,直接索引tr即可获得对应的tr。arr.sort函数是直接在原数组上排序。这个牛客js可以通过。。。

<body>
    <table>
    <thead>
        <tr><th>id</th><th>price</th><th>sales</th></tr>
    </thead>
    <tbody id="jsList">
        <tr><td>1</td><td>10.0</td><td>800</td></tr>
        <tr><td>2</td><td>30.0</td><td>600</td></tr>
        <tr><td>3</td><td>20.5</td><td>700</td></tr>
        <tr><td>4</td><td>40.5</td><td>500</td></tr>
        <tr><td>5</td><td>60.5</td><td>300</td></tr>
        <tr><td>6</td><td>50.0</td><td>400</td></tr>
        <tr><td>7</td><td>70.0</td><td>200</td></tr>
        <tr><td>8</td><td>80.5</td><td>100</td></tr>
    </tbody>
    </table>
    <script type="text/javascript">
     //将列表存储为对象数组 再利用数组排序
     var tbody = document.getElementById('jsList'); // 获取<tbody>元素
     var rows = tbody.getElementsByTagName('tr'); // 获取所有<tr>元素
     var arr=[]
     for (var i = 0; i < rows.length; i++) {
       var tds = rows[i].getElementsByTagName('td'); // 获取当前行下的所有<td>元素
       // 分别提取每个<td>元素的内容 并转换为数字
       var td1 = Number(tds[0].innerText); // 第一个<td>
       var td2 = Number(tds[1].innerText); // 第二个<td>
       var td3 = Number(tds[2].innerText); // 第三个<td>
       var obj={}
       obj["id"]=td1
       obj["price"]=td2
       obj["sales"]=td3
       arr.push(obj)
     }
     function sort(type, order) 
     {
       var res = arr.sort(function(a,b){
         if(order==='asc')
           return a[type]-b[type]
         else if(order==='desc')
           return b[type]-a[type]
       })
       render(res)
     }
     function render(res)
     {
       var str=''
       res.map(item=>{
         str+=`<tr><td>${item.id}</td><td>${item.price}</td><td>${item.sales}</td></tr>`
       })
       tbody.innerHTML=str
     }
     sort('sales','asc')
    </script>
</body>

总结:这个是可以满足题目要求的,但是牛客js报错。。。