如何使用Javascript加载文件内容并在其中插入变量？

我正在使用以下jQuery方法向div添加一些html：

$('#pageTabContent').append($('\
                    <div class="tab-pane" id="'+ticketId+'">\
                        And a whole lot more html here..
                    </div>'));

$（'#pageTabContent'）。追加（$（'\
\
还有更多的html。。
'));

这很好，但是因为我的javascript中有太多的html，所以我想将其移动到一个单独的文件中。问题是我还需要在html中插入

ticketId

。有没有一种方法可以使用Javascript/jQuery从单独的文件加载html，但仍然在其中插入

ticketId

[编辑]请注意，每次使用此代码时，ticketId都是不同的。我将在一次页面加载中被多次使用，因此我无法使用php在html中加载ticketId。我必须在客户端完成

---

欢迎所有提示

我通常建议避免在javascript中生成动态html。 有几种很好的基于模板的框架。我喜欢在KnockoutJS中使用的一个

这种方法的另一个好处是在模型和html元素之间进行更改跟踪。

对于该特定示例，它非常简单：

$.get("/path/to/file.html", function(html) {
    var newStuff = $(html);
    newStuff.find("div.tab-pane:first").attr("id", ticketId);
    newStuff.appendTo("#pageTabContent");
});

你可以概括一下，基本概念是：1。加载HTML，2。使用jQuery从中创建DOM元素，3。使用jQuery查找有问题的元素并对其进行修改，4。添加到元素中

另一种方法是使用某种形式的模板，模板插件或DIY：

$.get("/path/to/file.html", function(html) {
    html = html.replace("{{ticketId}}", ticketId);
    $("#pageTabContent").append(html);
});

---

同样，也有插件和模板系统可以为您提供这些功能，这些插件和模板系统可以提供各种功能，而不是您自己的功能。

您可以考虑使用类似或的模板引擎。函数接受参数。