使用ajax将数据渲染为html的最佳实践

Question

我试图在一些已经定义的div中加载一个项目的一些细节点击该项目.我有两种方法可以做到这一点.

注意:我使用python/django作为后端,并在前端使用jquery

我的第一种方式

Views.py

def get_item_data(id):
    obj = MyClass.objects.get(pk=id)
    html = """
              <div>All Details Here, 1. {0}, 2. {1}</div>
           """.format(str(obj.id), str(obj.name))

    return HttpResponse(html)

myapp.js

$('#myid').on('click', function(){
     $.ajax({
        type: "GET",
        url: GET_DATA,
        data: dataString,
        success: function(res) {
                $('#addl_container').html(res);
        }
    });
});

II.另一种方法

Views.py

def get_item_data(id):
    obj = MyClass.objects.filter(pk=id).values()
    return HttpResponse(simplejson.dumps(obj))

myapp.js

$('#myid').on('click', function(){
     $.ajax({
        type: "GET",
        url: GET_DATA,
        data: dataString,
        success: function(res) {
                $('#addl_container').html(
                   "<div>All Details Here, 1. "+ res.id +", 2. "+ res.name + "</div>"
                );
        }
    });
});

这两个过程都有效.我认为事先创建html并加载它可能不是一个好选择,因为我们使用python代码创建html然后加载它.如果我尝试从不同的应用程序访问相同的URL,它也将工作.通过从json响应中提取数据从jquery创建html似乎是一个很好的解决方案,但有时当数据很大时,在用户端需要更多ram,这会使系统变慢.

我很困惑哪一个使用,请建议这两个更好的解决方案.还建议其他解决方案比这更好吗？

提前致谢.

Answer 1

我更喜欢尽可能将模板、业务和js逻辑分开。它使其更加Python化，并且更加符合 django 设计原则。这确实与您的第一个方法非常相似，但使用 html 模板，而不是将 html 打印到视图中的字符串。

视图.py

def get_item_data(id):
    template_name = 'index.html'
    obj = MyClass.objects.get(pk=id)
    context = {
        'obj': obj,
    }
    html = render_to_string(template_name, context)
    return HttpResponse(html)

索引.html

<h1>{{ obj }}</h1>

myapp.js

$('#myid').on('click', function(){
    $.ajax({
        type: "GET",
        url: GET_DATA,
        data: dataString,
        success: function(res) {
            $('#addl_container').html(res);
        }
    });
});