Question

我有一个像这样的简单代码：

$('#tblPrice').replaceWith( $('#tblPrice').html()
   .replace(/<tbody/gi, "<div id='table'")
   .replace(/<tr/gi, "<div")
   .replace(/<\/tr>/gi, "</div>")
   .replace(/<td/gi, "<span")
   .replace(/<\/td>/gi, "</span>")
   .replace(/<\/tbody/gi, "<\/div")
   );

我有多个id为tblPrice的表。它一次只替换一个表所以如何使这成为.each function ()

Answer 1

我有多个ID为tblPrice的表。

这是你的问题。 IDs must be unique。 JavaScript将停止查看它找到的第一个匹配ID。修改您的#tblPrice表，使其具有不同的ID，但每个表都有一个类似的类，然后使用类选择器而不是ID选择器。

例如：

<table class="tblPrice" id="tblPrice1">
    ...
</table>
<table class="tblPrice" id="tblPrice2">
    ...
</table>

要将其转换为.each()循环，您可以简单地：

$('.tblPrice').each(function() {
    var $this = $(this);
    $this.replaceWith($this.html() ... );
});

出于上述原因，您还需要更改HTML替换中的id="table"。改为使用一个类：

.replace(/<tbody/gi, "<div class='table'")

Answer 2

只需在所有表中获取一个class属性并输入以下代码： -

$('.tblPrice').each(function() {
    var $this = $(this);
    $this.replaceWith($this.html() ... );
});

Answer 3

ID 在DOM中应该是唯一的。即使您在此处使用.each方法，也只会在每次使用ID时获得第一个元素。

我建议使用class，然后将它们添加到myTable等所有表中，并修改代码，如：

$('.myTable').replaceWith(function () {
    return $(this).html()
        .replace(/<tbody/gi, "<div id='table'")
        .replace(/<tr/gi, "<div")
        .replace(/<\/tr>/gi, "</div>")
        .replace(/<td/gi, "<span")
        .replace(/<\/td>/gi, "</span>")
        .replace(/<\/tbody/gi, "<\/div");
});

Answer 4

正如评论所说..

$(".tblPrice").each(function() { 
$(this).replaceWith( $(this).html()
.replace(/<tbody/gi, "<div id='table'")
.replace(/<tr/gi, "<div")
.replace(/<\/tr>/gi, "</div>")
.replace(/<td/gi, "<span")
.replace(/<\/td>/gi, "</span>")
.replace(/<\/tbody/gi, "<\/div")
);
});

Answer 5

您可以更改表格的样式，而不是替换为jquery，它的子元素就像div和span一样。

例如，

table, tr, tbody{
    display: block;  /* div */
    /* other css styles */
}

td{
    display: inline; /* span */
    /* other css styles */
}

这个方法并没有完全改变表格元素，但它可能会帮助你实现你想要实现的目标。

在.each函数jQuery上进行替换

5 个答案: