如何将表th转换为li，将表td转换为<；p>；使用javascript？

你好，我有这样的桌子

<table>
  <tbody>
    <tr>
      <th>PROVINSI</th>
      <th>KABKOT</th>
      <th>KECAMATAN</th>
      <th>DESA</th>
    </tr>

    <tr>
      <td>KALIMANTAN TENGAH</td>
      <td>SERUYAN</td>
      <td>SERUYAN HILIR</td>
      <td>TANJUNG RANGAS</td>
    </tr>
  </tbody>
</table>

<ul>
      <li>PROVINSI<p>KALIMANTAN TENGAH</p></li>
      <li>KABKOT<p>SERUYAN</p></li>
      <li>KECAMATAN<p>SERUYAN HILIR</p></li>
      <li>DESA<p>TANJUNG RANGAS</p></li>

</ul>

普罗文西
卡布科特
凯卡马坦
德萨
加里曼丹腾加
塞鲁延
塞鲁扬·希利尔
丹戎·兰加斯

我想把这个表转换成这样的无序列表

<table>
  <tbody>
    <tr>
      <th>PROVINSI</th>
      <th>KABKOT</th>
      <th>KECAMATAN</th>
      <th>DESA</th>
    </tr>

    <tr>
      <td>KALIMANTAN TENGAH</td>
      <td>SERUYAN</td>
      <td>SERUYAN HILIR</td>
      <td>TANJUNG RANGAS</td>
    </tr>
  </tbody>
</table>

<ul>
      <li>PROVINSI<p>KALIMANTAN TENGAH</p></li>
      <li>KABKOT<p>SERUYAN</p></li>
      <li>KECAMATAN<p>SERUYAN HILIR</p></li>
      <li>DESA<p>TANJUNG RANGAS</p></li>

</ul>

加里曼丹省

卡布科特SERUYAN

KECAMATANSERUYAN HILIR

德萨TANJUNG RANGAS

如何使用javascript实现这一点

我试过这个

function(){
    var ul = $("<ul>");
    $("table tr").each(function(){
        var li = $("<li>")
        $("th, td", this).each(function(){
            var p = $("<p>").html(this.innerHTML);
            li.append(p);
        });
        ul.append(li);
    })    
    $("table").replaceWith(ul);   
}

function（）{
var ul=$（“
”）；
$（“表tr”）。每个（函数（）{
变量li=$（“
”）
$（“th，td”，this）.each（function（）{
var p=$（“”）.html（this.innerHTML）；
li.追加（p）；
});
ul.附加（li）；
})    
$（“表”）。替换为（ul）；
}

但我真的不明白如何在这张桌子上绕圈子。抱歉

$（文档）。准备就绪（函数（）{
    $(document).ready(function(){
    var headers = new Array();
    var values = new Array();
       $('table th').each(function(){
                headers.push($(this).text());

        });

       $('table td').each(function(){
                values.push($(this).text());

        });

     var returndata = "<ul>";
         for(i=0;i<headers.length;i++){
           returndata+="<li>"+headers[i]+"<p>"+values[i]+"</p></li>";
        }

    returndata+="</ul>"; 


 $("table").html(returndata);   


    });

var headers=新数组（）；
var值=新数组（）；
$（'table th'）。每个（函数（）{
headers.push（$（this.text（））；
});
$（'table td'）。每个（函数（）{
value.push（$（this.text（））；
});
var returndata=“
”；
对于（i=0；i假设
…


var ul=$（“
”）；
$（“#目标th”）。每个（功能（i、v）{
变量li=$（“
”）
li.append（$（v.text（））；
var p=$（“”）.append（$（$（“#目标td”）[i]）.text（）；
li.追加（p）；
ul.附加（li）；
})    
美元（“#目标”）。替换为（ul）；

普罗文西
卡布科特
凯卡马坦
德萨
加里曼丹腾加
塞鲁延
塞鲁扬·希利尔
丹戎·兰加斯
转换
函数转换（）{
var a=document.getElementsByTagName（'th'）；
var c=document.getElementsByTagName（'td'）；
var b=''；
var d=“”；
对于（变量i=0；i”+a[i].innerHTML+“”；
}
a[0].parentNode.innerHTML=b；
对于（变量i=0；i”；
}
c[0].parentNode.innerHTML=d；
}

使用普通Javascript

希望以下代码可以帮助您：

(function ($){
    var ul = $("<ul>");
    var li = null
    var p = null;
    var content = null;

    var table = $("table");
    var ths = table.find("tr").eq(0).find("th");
    var tds = table.find("tr").eq(1).find("td");

    ths.each(function (){
        li = $("<li>");
        p = $("<p>");

        content = $(this).html();
        p.html( tds.eq($(this).index()).html());

        li.append(content);
        li.append(p);
        ul.append(li);

    });
    table.replaceWith(ul);
})(jQuery);

（函数（$）{
var ul=$（“
”）；
var li=null
var p=null；
var-content=null；
var表=$（“表”）；
var ths=表。查找（“tr”）。等式（0）。查找（“th”）；
var tds=表.查找（“tr”）.等式（1）.查找（“td”）；
ths.每个（函数（）{
li=$（“
”）；
p=$（“”）；
content=$（this.html（）；
p、 html（tds.eq（$（this.index（））.html（））；
追加（内容）；
li.追加（p）；
ul.附加（li）；
});
表.替换为（ul）；
})（jQuery）；

今天是好日子：你试过什么了吗？请看我的编辑。我不太懂javascript，但我真的需要it@shyam当你可以用普通的Javascript实现时，为什么要使用jQuery呢？jQuery是Javascript@shyam