更改具有相同尺寸的html标记

Question

我有一个包含不同条目的长表，其中一些标记为“xxx”。 生成html代码时，带有xxx的行看起来像这样（由插件生成）：

<td style="vertical-align:middle; text-align:center; border:2px solid #000000; width:504pt; height:29pt" colspan="12">xxx</td>

我想将此更改为具有相同尺寸的textarea，以便它不会扭曲表格。

我认为jQuery会完成这项工作，但我无法弄清楚如何提取colspan，宽度或高度，并将其设置为新的textarea。我有这个代码，它将所有xxx实例替换为textareas，但它们都是相同的大小，扭曲了表格式。

<script>
    var replaced = $("body").html().replace(/xxx/g,'<textarea></textarea>');
    $("body").html(replaced);
</script>

任何建议都表示赞赏。

PS：我正在使用CakePHP 2.0并使用PHPExcel将excel更改为html，并在xxx的任何地方生成textareas。

Answer 1

如果你总是会替换＆＃34; xxx＆＃34;，我不明白为什么你需要＆＃34;提取＆＃34;任何东西。如果您使用width属性一段时间，您将获得不需要扭曲表格并将其硬编码为<textarea style="width:XXpx">定义所需的确切像素。

您可以做的其他事情是在textarea定义中设置cols和rows属性

var replaced = $("body").html().replace(/xxx/g,'<textarea cols="3" rows="1"></textarea>');

而不是with，如果单词总是3个字母长，则使用cols="3"。

但是，如果我误解了您想要做的事情，而您需要来动态更改样式和attributes，则可以从<td>中提取colspan此

$("#the-td").attr("colspan");

但是，您需要引用正确的<td>。为了提取style，代码是

$("#the-td").css("width");

Answer 2

我能够使用以下代码解决此问题：

var replaced = $("body").html().replace(/xxx/g,'<textarea style=" width: 100%; height: 100%; min-height:3em; box-sizing: border-box; resize: none; display:block;"></textarea>'); $("body").html(replaced);

这创建了表格，其中xxx完全符合大纲表的格式。最后，不需要复杂的数据提取。 我的案子非常特别，所以我不知道它是否会对任何人有所帮助，但希望能有所帮助。