如何设计动态脚本生成作为AJAX响应的一部分

How to design dynamic script generation as part of AJAX response?

本文关键字:AJAX 响应 一部分 动态 脚本      更新时间:2023-09-26

我正在试验模块化AJAX设计,其中返回一个脚本来处理和显示有效负载。我目前有以下JSON响应工作,但我想在构建应用程序方面得到一些建议,以便以更可维护的方式支持它。

{
    payload: "<div class='"test'">Something</div>",
    load: "jQuery(this.payload).appendTo('body')"
}

要生成"加载"脚本,我考虑:

  • 通过this传递所有动态变量并从服务器加载固定JavaScript

    jQuery(this.payload).appendTo(this.appendTo)
    
  • 用动态内容替换JavaScript中的特殊模板:

    jQuery(this.payload).appendTo('{{APPENDTO}}')
    
  • 也许会有更好的方法?

之前我有以下结构;

[
    {
        args: ["<div class='"test'">Something</div>"],
        method: "appendTo",
        selector: "body"
    },
    ...
]

你可以这样做;

var foo = JSON.parse(theJSON);
for (var i=0;i<foo.length;i++) {
    var curr = foo[i];
    jQuery.fn[method].apply($(curr.selector), curr.args);
}

这支持最常见的DOM方法,但也可以支持remove(), empty()等;

[
    {
        args: [],
        method: "remove",
        selector: ".someElement"
    },
    ...
]

如果这仍然过于严格,您应该考虑完全跳过JSON,而只是将响应作为<script>标记插入到页面中。