Question

为什么查找和替换html代码不起作用？但是当我测试一个字符串或一些文本时，它可以工作。请给我解决方案。下面我会在需要时写示例代码和结果代码

（＃1）我的代码：

$(document).ready(function() {
  var getContent = $("table").html();
  var setReplaced = getContent.replace(/\td><td/g, 'td></tr><tr><td');
  $("table").html(setReplaced);
  console.log(setReplaced);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>111</td>
      <td>222</td>
    </tr>
    <tr>
      <td>333</td>
      <td>444</td>
    </tr>
  </tbody>
</table>

（＃2）我想要这样的HTML。

<table>
    <tbody> 
        <tr>
            <td>111</td>
        </tr>
        <tr>
            <td>222</td>
        </tr>
        <tr>
            <td>333</td>
        </tr>
        <tr>
            <td>444</td>
        </tr> 
    </tbody>
</table>

请更正我的jquery代码。给我一个解决方案非常感谢你

Answer 1

看起来您的正则表达式中有错字。你是说：

getContent.replace(/\/td><td/g,'/td></tr><tr><td');

Answer 2

您正尝试替换以下实例：\td><td，但您永远不会用反斜杠关闭HTML标记。 \td>应该改为正斜杠。确保您也将其逸出。

getContent.replace(/\/td><td/g,'/td></tr><tr><td');

Answer 3

您可以使用each循环而不是正则表达式：

$('tr').each(function() {
  var $thisTr = $(this),        // get this tr
    $newTr = $('<tr></tr>');    // make a new tr
  
  $newTr.append($thisTr.children().last());    // append the last cell into the new tr
  $thisTr.after($newTr);                       // put the new tr after the current tr
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>111</td>
      <td>222</td>
    </tr>
    <tr>
      <td>333</td>
      <td>444</td>
    </tr>
  </tbody>
</table>

Answer 4

也许这样吗？

buildscript {

repositories {
...
}
dependencies {
    //classpath "com.android.tools.build:gradle:3.2.0-beta04"  // buggy databinding
    classpath "com.android.tools.build:gradle:3.1.3" // working
}}

$(document).ready(function() { 
  var tds = $('table').find('td');
  if ( tds.parent().is( "tr" ) ) {
    tds.unwrap();
  }
  $('table td').wrap('<tr>');
});

Answer 5

这似乎是您真正想要的：

对于每个非第一个td
在当前目录下插入新的tr
然后在新行中移动td

这具有不直接修改html的优点

$(document).ready(function() {
    var table = $("table");
    var cells = $("td:not(:first-child)", table);
    cells.each(function(i, td) {
        var newtr = $("<tr>");
        $(td).parent().after(newtr);
        newtr.append(td);
    });
});

查找并替换所有无法正常工作的HTML代码

5 个答案: