【问题标题】:dynamically generate content for a page when clicking on product单击产品时为页面动态生成内容
【发布时间】:2020-08-11 08:33:32
【问题描述】:

每个人。我正在制作一个带有 T 恤的网站。我使用 JSON 文件为产品动态生成预览卡片,但我还需要在点击卡片时为 HTML 文件生成内容。因此,当我单击它时,会打开一个新的 HTML 页面,例如 product.html?product_id=id。我不明白如何检查 id 或这部分 ?prodcut_id=id,并根据 id 为页面生成内容。任何人都可以链接一些指南或好的解决方案,我什么都不懂:(。

【问题讨论】:

  • 您需要在服务器端运行并进行查找的代码。

标签: javascript html jquery json


【解决方案1】:

听起来您希望用户的浏览器要求服务器根据名为 product_id 的变量的值加载特定页面。

浏览器与服务器通信的方式是 HTTP 请求,您可以在 javascipt.info 和/或 MDN 上了解有关它的所有基础知识。

?product_id=id 被称为 URL 的“查询”部分,您可以在 MDNWikipedia 上了解更多信息。

从服务器获取具有此类 URL 的页面的请求通常是GET 请求,与更常见和通用的POST 请求类型相比,它更简单且安全性要求更低.

您可能会注意到一些关于 AJAX 请求的资源(用于更新当前页面的部分而不重新加载整个内容),但您无需担心这是因为您只是想让浏览器导航到新页面。

您的服务器需要有一些代码来处理任何此类请求,基本上是说:

"如果有人在此处发送 HTTP GET 请求,请查看 product_id 变量的值并将其与我可用的 HTML 文件进行比较。如果匹配,则使用匹配文件发送响应,如果不匹配,发送一个显示“错误 404”的页面。”

无论如何,这是快速概述。这些资源会告诉你更多关于细节的信息。

【讨论】:

    【解决方案2】:

    有一些解决方案,如何从 url 中获取参数: Get ID from URL with jQuery

    了解什么是 REST Api 以及如何构建自己的 API 也很有意义,因为我认为您目前没有后端。 这里有一些参考: https://www.conceptatech.com/blog/difference-front-end-back-end-development https://www.tutorialspoint.com/nodejs/nodejs_restful_api.htm

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-03-27
      • 1970-01-01
      • 2010-11-07
      • 2018-04-30
      • 2018-03-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多