用JavaScript替换html字符串

Question

我需要为从post调用中获得的每个结果生成一个HTML块。以下是模板：

 var tempScore = '<tr class="brick">' +
    '<div class="brick" style="border: solid 1px #808080; padding: 5px; margin: 10px; overflow-y: auto; width: 100%">' +
    '<h5 class="spamHead">{title}</h5>' +
    '<div style="width: 120px;">' +
    '<h4>{spamStatus}' +
    '<div class="spamStat" style="margin-right: 5px; float: left; background: {color}">' +
    '</div>' +
    '</h4>' +
    '</div>' +
    '<h4 style="text-align: left;">{scoreInject}</h4>' +
    '<div class="spamHeader"><h4>{spamHeaders}</h4></div>' +
    '</div>' +
    '</tr>';

目前，我循环通过和可以替换所有括号内的{}项目，没有任何麻烦。但是现在我需要添加一个新的span标记，其中包含了JavaScript，但是没有正确地替换它。以下是可能的项目之一，我可以将结果替换为：

tempScore.replace("{scoreInject}", '\<span class=\"tooltip\" onmouseover=\"tooltip.pop(this, \'Outlook' +
                        ' utilizes a self-learning filter to determine what you think is spam. While this is great for individual' +
                        ' users, it’s not consistent nor reliable for use across thousands of tests on our servers. Instead, we’ve ' +
                        'added in hundreds of spam rules that have been published by Outlook. Whenever the content in your campaign ' +
                        'triggers one of these rules, we’ll provide you with feedback on what can be changed to make your email look ' +
                        'less spammy to Outlook. This filter on Litmus uses built-in junk email filter for Outlook, which ships as ' +
                        'part of Microsoft Office. This has various sensitivity settings, here we have set it to ‘High’. The Microsoft ' +
                        'Outlook filter scores from 0-10 on the High sensitivity rating, with 0 being the highest (passing) and 10 being ' +
                        'the lowest (failing). Outlook rates an email with a 6.0 or higher (out of 10) as a failure. A lower score (lower than 6.0) ' +
                        'is considered a passing score with the High sensitivity rating.\', {position:0})"\>Spam Score: {spamScore}\</span\>');

我想我搞砸了其中一个转义角色。理想情况下，span标记及其中的所有内容都将被巧妙地替换为{scoreInject}。由于这个过程的性质，我很难为每一项分配id，并使用jQuery替换标记的属性。

Answer 1

为你做了一个jsFiddle：https://jsfiddle.net/eqymm0La/

我想你不需要给\<\/span\>和\"拍照。

另外，您需要更新您的var：

tempScore = tempScore.replace("{scoreInject}", '<span class="tooltip" onmouseover="tooltip.pop(this, \'Outlook' +
                    ' utilizes a self-learning filter to determine what you think is spam. While this is great for individual' +
                    ' users, it’s not consistent nor reliable for use across thousands of tests on our servers. Instead, we’ve ' +
                    'added in hundreds of spam rules that have been published by Outlook. Whenever the content in your campaign ' +
                    'triggers one of these rules, we’ll provide you with feedback on what can be changed to make your email look ' +
                    'less spammy to Outlook. This filter on Litmus uses built-in junk email filter for Outlook, which ships as ' +
                    'part of Microsoft Office. This has various sensitivity settings, here we have set it to ‘High’. The Microsoft ' +
                    'Outlook filter scores from 0-10 on the High sensitivity rating, with 0 being the highest (passing) and 10 being ' +
                    'the lowest (failing). Outlook rates an email with a 6.0 or higher (out of 10) as a failure. A lower score (lower than 6.0) ' +
                    'is considered a passing score with the High sensitivity rating.\', {position:0})"\>Spam Score: {spamScore}</span>');

Answer 2

我认为除了'字符在\'Outlook和rating.\'之外，您不需要转义任何东西。所以试着移除你做过的所有其他逃跑的事。

此外，为了保持一致性，在代码中始终使用相同类型的引号。除了'之外，您还使用了"{scoreInject}"，因此您可能想要更改它，以获得更清晰的代码。