用Ajax加载HTML vs.用Ajax加载数据然后用Javascript构建HTML

Load HTML with Ajax vs. load only data with Ajax and build the html with Javascript

本文关键字:HTML 加载 Ajax 构建 Javascript vs 数据 然后      更新时间:2023-09-26

我正在做一个项目,需要通过 AJAX 一些 HTML 页面上的信息加载。但是我不太确定如何加载这些信息。


我不知道哪种方法更适合我:

1)用AJAX加载整个HTML,然后将其附加到页面

2)仅用AJAX加载数据,然后使用Javascript (+ JQuery)构建HTML


我倾向于使用的是第一个方法,因为这是最简单的方法,但对于memory(我要加载的最大文件大约有7kb,这不是太多)


第二个是最难的,涉及一个巨大的Javascript (Jquery)代码来构建HTML(我还必须加载元素的属性)。因为我有很多不同的HTML代码要加载,我必须制作很多conditions(例如一个button,一个title,一个textarea等),我还必须创建包含HTMLvariables

我的问题是什么方法是最好的在我的情况下使用?

我会始终坚持将数据/逻辑和视图清晰划分的解决方案。第一种选择可能就是这种情况。修改用JavaScript生成的HTML是相当困难的。

我建议另一个选择:使用客户端模板。使用ajax调用加载模板和数据,然后使用javascript填充模板。对于这种情况,有一些库。

我可以想象一对开发人员在工作:一个全职后端开发人员和一个全职前端开发人员。BE开发人员必须为FE开发人员发送一些数据以正确显示它。考虑到编程尽可能简单,他选择了op描述的第一种方法。大家都很高兴。

几个月后,这些数据的表示需要更新。经理迅速打电话给前端开发人员,前端开发人员说:

"呃…没办法。整个数据已经直接从服务器格式化。"

哦不!如果数据仅以RAW data的形式来自服务器,会发生这种情况吗?

第二个方法:

仅用AJAX加载数据,然后使用Javascript(+JQuery)构建HTML

非常合适,这些方法的一个主要优点是您的ajax响应将变得更快。此外,将逻辑与设计分离更符合逻辑。

注意:最好的解决方案总是取决于你的具体情况。