javascript - 使用 Javascript 创建侧边栏是一个好习惯吗？

Question

关闭。这个问题是 opinion-based 。目前不接受答案。

---

想要改进这个问题吗？更新问题，以便 editing this post 可以用事实和引文来回答它。 .

已关闭 9 年前。

Improve this question

几个月前，我意识到我需要每年使用新链接更新侧边栏。现在，我决定创建一个 javascript 文件并将其链接到每个页面，而不是遍历每个页面并插入链接(大约 20 页)。该脚本将创建链接并将其附加到页面。这意味着每次我们需要创建新链接时，我们只需向 javascript 文件添加一次新行，所做的更改就会反射(reflect)在每个页面上。本质上减少了浏览所有页面和添加新链接所浪费的时间。我想知道这是否是一个好的做法，是否会出现我未能预见到的问题？

代码如下:

function createVolume (text, link){
  var volDiv = document.createElement("div");
  var textDiv = document.createTextNode(text);
  var linkDiv = document.createElement("a");
  linkDiv.setAttribute("href", link);
  volDiv.setAttribute("class", "volume");
  volDiv.appendChild(textDiv);
  linkDiv.appendChild(volDiv);
  var d = document.getElementById("e27");
  d.appendChild(linkDiv);
}
var bhbHome = createVolume("BHB Home", "bhb.html");
var v76 = createVolume("Volume 76", "bhb76.html");
var v75 = createVolume("Volume 75", "bhb75.html");
var v74 = createVolume("Volume 74", "bhb74.html");
var v73 = createVolume("Volume 73", "bhb73.html");
var v72 = createVolume("Volume 72", "bhb72.html");
var v71 = createVolume("Volume 71", "bhb71.html");
var v70 = createVolume("Volume 70", "bhb70.html");
var v69 = createVolume("Volume 69", "bhb69.html");
var v68 = createVolume("Volume 68", "bhb68.html");
var v67 = createVolume("Volume 67", "bhb67.html");
var v6566 = createVolume("Volume 65 and 66", "bhb_65_66.html");
var v64 = createVolume("Volume 64", "bhb64.html");
var v63 = createVolume("Volume 63", "bhb63.html");
var v626160 = createVolume("Volume 60, 61, and 62", "bhb_60_61_62.html");
var v59 = createVolume("Volume 59","bhb59.html");

Answer 1

我能想到一些缺点，前两个假设代码在 DOM 准备好时运行:

1. 可以有重新排列的效果，用户首先看到的是页面没有侧边栏，然后有它
2. 您需要确保仅运行需要侧边栏的页面上运行的其他代码创建侧边栏后。
3. (@Sheikh Heera)某些搜索引擎将无法索引您的整个页面

传统的处理方式是使用服务器端包含，所以如果可以的话请研究一下。