【问题标题】:How do I avoid duplicating HTML in javascript and the backend?如何避免在 javascript 和后端中重复 HTML?
【发布时间】:2023-04-11 09:58:02
【问题描述】:

我正在编写一个类似于 facebook 的发布系统,用户可以在其中输入文本评论并让它立即出现在页面上的一个正确样式和格式的框中,同时文本被 ajax'd 到后端以被存储。评论基本上是 HTML5 ,但它的结构相当复杂,因此实际文本应该最终出现在文章中的 div 中的 div 中的 div 中。我正在用 jquery 做这个 DOM 操作。

生成页面时,后端需要遍历每条评论,并将评论文本(以及海报名称、时间戳等元数据)插入到 django 模板中的适当位置。

这提出了一个概念性问题——我现在在我的代码中的两个位置复制了一组相当复杂的嵌套 html 标签,其中包含适当的类和 id 名称:带有 jquery 的 js 文件以添加新注释,以及后端模板引擎生成初始页面 html。这对我来说已经是一个问题,因为我仍在设计评论中需要在样式方面发生的确切内容,并且在我的代码中的两个位置包含这个复杂的 HTML 包已经让我感到困惑。

处理这种 HTML 重复的最佳做法是什么?我无法删除 jquery,因为我需要它来处理 cmets 的动态添加。同时,放弃 django 的模板引擎的力量来构建我需要的 HTML 结构并在每个评论的基础上填写详细信息似乎很浪费 - 加上我不想总是呈现一个空白页面和每次用户加载页面时,使用 jquery DOM 操作动态构建可能非常多的 cmets。有什么我没想到的东西可以解决这个问题吗?

【问题讨论】:

  • 可能的解决方案:获取列表中的第一条评论,复制它并使用display:none 将其放在该评论上方,在那里编辑您需要编辑的内容,显示它。

标签: jquery django code-duplication


【解决方案1】:

只需让您的 Ajax 处理视图返回呈现的 HTML 片段,使用模板而不是 JSON,jQuery 只是将它们插入到正确的位置,而不是从原始数据构建它们。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-02-05
    • 1970-01-01
    • 2021-08-01
    • 1970-01-01
    • 1970-01-01
    • 2014-05-15
    相关资源
    最近更新 更多