Javascript 多行字符串替换为多行字符串

Question

我试图使用 javascript 将多行字符串替换为另一个多行字符串。我该怎么做？

例如，伪代码可能如下所示，其中要搜索和设置的字符串是运行时变量/参数(不是如下所示的硬编码)，因此我们无法创建固定的正则表达式。有什么想法吗？

要搜索的字符串类似于，

<tr>

    <td colspan="3" class="footer">&nbsp;</td>

</tr></tbody></table>

并让要替换的字符串为，

<tr>

   <td colspan="3" class="footer">New Arrivals!!!</td>

</tr>

<tr>

<td colspan="3" class="footer">&nbsp;</td>

</tr></tbody></table>

伪代码，

var regExp = new RegExp(strMultiLineTextToSearch.trim(), "gm");
var matches = htmlContent.match(regExp);
alert(matches.length);
if(matches.length > 0){
    var newHtml= htmlContent.replace(regExp , strMultiLineTextToSet );
}

使用火狐22.0

Answer 1

also, the strings are prased from webpage using some string foo and innerHTML.

哎呀!不要使用 HTML 操作将内容添加到表中。这就像通过让画家向您描述图片来向一幅大画添加一个小细节，然后根据该描述绘制一幅新图片，只不过您更改了描述中的小细节。

不仅速度慢得令人难以置信，而且画家很可能不会使用您第一次告诉他画图时使用的相同词语。如果他说“年轻女子”而不是“女士”，你会感到困惑。你想让那位女士拿着什么东西，但只有一个年轻的女人。相反，你应该告诉画家给这位女士一些东西。

这同样适用于这里:您确定您在搜索的字符串中使用的空格数量与表中的空格数量完全相同吗？如果不存在，则不会找到该字符串。即使有，您如何确定浏览器不会重新排列标签内的属性(IE 喜欢按字母顺序对它们进行排序)？在参数后面添加空格？某些浏览器扩展可能会添加自己的属性或类...

相反，使用 DOM 操作。就是这张照片。 HTML 是它的描述。

如果您向该行添加 ID，则可以很容易从 javascript 中找到它。然后创建新元素并将其放置在该行之前。

var lastRow = document.getElementById("last-row")
var td = document.createElement("td")
td.className = "footer"
td.colspan = 3
var text = document.createTextNode("New arrivals!!!")
td.appendChild(text)
lastRow.parent.insertBefore(lastRow, td)

如果该表很容易找到，您可以通过该表访问其最后一行:

var table = document.getElementById("my-table")
var lastRow = table.rows[table.rows.length - 1]
...

<小时/>

您似乎正在使用表格来布局页面。这不是一个干净的方法(该页面在语义上不是一个表格，有很多不必要的元素；请注意 <table> 和 display:table 之间的区别)。添加空的间隔单元格几乎肯定是错误的。使用CSS margin-bottom或padding-bottom相反(除非您正在制作 HTML 电子邮件 - 在这种情况下，无论如何使用 CSS，然后使用为此目的而存在的 some freeware web service 转换为邮件安全表单)。 CSS 并不难。不使用它会困难得多。