Question

我有一个像这样的JS字符串：

var html_string = "<h3 id='title'>ABC</h3><h5 id='subtitle'>XYZ</h5>";

然后将此字符串放入使其可见的CodeMirror iframe中。我想让用户使用<input>字段轻松更改标题和字幕。 如何使用ID标记替换这些特定文本？

例如，如果标题输入为“Hello”，则字幕输入为“World”，当前字符串类似于新字符串应显示的字符串：

"<h3 id='title'>Hello</h3><h5 id='subtitle'>World</h5>"

我应该使用RegEx吗？这样做的正则表达式的结构是什么？

请注意，我不能简单地执行replace("ABC", "Hello")我需要根据代码的ID更改文字。

Answer 1

对于多个你可以使用类，而不是id

$("h3.title").each(function(index){
    if($(this).text()=="Hello"){
        $("h5.subtitle:eq("+index+")").replace("XYZ",$("input#ID").val());
    }
})

Answer 2

将HTML字符串呈现到页面中后，使用标记的id替换文本，如下面的示例代码所示：

$('#title').html("Hello");
$('#subtitle').html("World");

OR

如果您知道旧内容和新内容，请使用如下所示的替换功能。

html_string .replace("ABC", "Hello");
html_string .replace("XYZ", "World");

Answer 3

是的，您应该使用正则表达式。假设html_string的结构是可预测的，如示例中所示（标题始终在<h3>，副标题始终在<h5>，没有其他属性，总是使用单引号等），您的代码可以这么简单：

html_string = html_string.replace( /(<h3 id='title'>).*?(</h3>)/, "$1New Text$2" );
html_string = html_string.replace( /(<h5 id='subtitle'>).*?(</h5>)/, "$1New Text$2" );

如果title和subtitle ID可能包含在不同的代码中，或者代码中包含其他属性，或者ID可能是双引号而不是单引号，那么您就可以了需要修改正则表达式来查找和处理这种意外情况。

正则表达式不适合解析复杂的HTML - 但它们是解决您已经解决的问题的非常好的解决方案。

在javascript中替换html字符串的特定id标记的内容

3 个答案: