与 JS 相同的 html 文件的动态链接答案

【问题标题】：Dynamic link for same html file with JS与 JS 相同的 html 文件的动态链接
【发布时间】：2018-09-01 20:59:29
【问题描述】：

有没有办法链接到相同的 html 并获得不同的链接，具体取决于您是否单击了这个或那个 href？假设我有 1.000 种不同的书。如果我单击第 1 本书的链接，它会将我带到该书的页面，如果我单击第 4 本书，则会将我带到第 4 本书的页面，依此类推。现在，因为每本书的结构都是一样的； ISBN、作者、页面、价格等，有没有办法让我使用相同的 html 文件而不是复制粘贴和重命名相同的 html 999 次，并且仍然有一个唯一的链接发送给朋友？可能是锚点之类的东西？

在 JS 中工作。

【问题讨论】：

你是如何创建链接的？使用 Javacript？如果是，请发布您的 html 和 js 的代码
您可以创建一个对象数组，其中包含您的书籍和 JS 地图中的所有数据，通过该数组创建内部地图函数锚标记作为 src 链接插入到该书籍，等等...但是，为了创建你想要的，动态加载的html内容，最好用Angular、Vue或React做SPA
@MichaelMontero 现在我没有解决方案。每本书都有一个 html，您只需使用 href 链接到该书的专用 html。

标签： javascript html

【解决方案1】：

由于您还没有发布您的代码，我不知道您是如何制作按钮的，但类似这样的东西可能会完成这项工作（顺便说一下，数组可能是从某个数据库、txt 文件或其他任何东西加载的，这个只是演示）：

var names = ["Books 1's name", "Books 2's name", "Books 3's name"];
var authors = ["Books 1's author", "Books 2's author", "Books 3's author"];

var i;
for (i = 0; i < 3; i++) { 

  document.write("<button onclick=\"rewrite(" + i + ")\">" + names[i] + "</button>");

}

function rewrite(index){
  
  document.getElementById("nameLabel").innerHTML = names[index];
  document.getElementById("authorLabel").innerHTML = authors[index];

}

<p id="nameLabel">Name of the book</p>
<p id="authorLabel">Author's name</p>

【讨论】：