Question

$.get("template.html", function( data ) {
  //replace placeholder
  //append
  $('editor').append($(data));
});

我的template.html是一个电子邮件模板，由不同的占位符组成，例如##name##等。我尝试替换，但我的数据不是字符串，因此data.replace('##name##',name)不起作用。这样做的正确方法是什么？

Answer 1

来自jquery documentation

成功回调函数传递返回的数据，该数据将是XML根元素，文本字符串，JavaScript文件或JSON对象，具体取决于响应的MIME类型

打开Web开发人员控制台（f12），查看＆＃34; network＆＃34;小组，看看＆＃34;标题＆＃34;在template.html

的请求中

它可能是一个XML根元素，然后要替换，你可以做这样的事情

var str = new XMLSerializer().serializeToString(data)
str = str.replace('##name##', name)

Answer 2

如果editor是您要附加到的div的ID，请使用$("#editor").append()。此外，您使用的替换功能将仅替换##name##的第一个实例，留下所有后续实例而不替换它们。

Answer 3

我无法理解为什么你的data不是字符串。

我已经尝试过您的代码了，它只是有效。

<强>的index.html

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://code.jquery.com/jquery.min.js"></script>
    <script>
        $(function() {
            $.get('email.html', function(data) {
                console.log(1, typeof data);
                console.log(2, data);
                console.log(3, data.replace('##title##', 'This is a so-called title'));
            });
        });
    </script>
</head>
<body>
</body>
</html>

<强> email.html

<!-- email.html -->
<div id="email">
    <p class="title">##title##</p>
    <p class="subject">##subject##</p>
    <div id="content">##content##</div>
</div>

Chrome中的输出：

1 "string"
2 "<div id="email">
    <p class="title">##title##</p>
    <p class="subject">##subject##</p>
    <div id="content">##content##</div>
</div>
"
3 "<div id="email">
    <p class="title">This is a so-called title</p>
    <p class="subject">##subject##</p>
    <div id="content">##content##</div>
</div>
"

IMO，您无法获得预期结果的原因是您可以使用file:///方案在浏览器中打开html来执行跨源请求（$.get）。你可以在控制台中得到这个错误：

XMLHttpRequest cannot load file:///Users/ooops/Sites/aaa/email.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

您可以将这些文件放在www（服务器）目录中，并使用浏览器中的localhost进行访问。去检查一下，希望这有帮助。

替换电子邮件占位符

3 个答案: