JS 注入添加标签：为网页添加“加入书架”按钮

以下是一个简单的示例，展示如何使用 JavaScript 将一个新的 HTML 标签添加到页面中并将其插入到 .imglist li 元素中的 a 标签下方：

首先，找到所有的 .imglist li 元素。例如，可以使用以下代码：

var imgList = document.querySelectorAll('.imglist li');

接下来，遍历所有的 .imglist li 元素并找到它们的 a 标签。例如，可以使用以下代码：

for (var i = 0; i < imgList.length; i++) {
  var aTag = imgList[i].querySelector('a');
}

然后，创建一个新的 HTML 元素并设置其属性。例如，要创建一个新的 a 标签并为其添加类名和内容，可以使用以下代码：

var newATag = document.createElement('a');
newATag.className = 'add-to-shelf';
newATag.innerHTML = '加入书架';

接下来，将新的 a 标签插入到 imgList li 元素中的 a 标签下方。例如，可以使用以下代码：

imgList[i].insertBefore(newATag, aTag.nextSibling);

最后，将新的 a 标签居中显示。例如，可以使用以下 CSS 样式：

.add-to-shelf {
  display: block;
  margin: 0 auto;
  text-align: center;
}

请注意，此示例仅用于演示如何添加新的 HTML 元素并将其插入到现有元素中。您可以更改要添加的标记类型，以及要添加的任何属性或内容。

newLink = document.createElement('a'); // 设置新 a 标签的内容和 href 属性
newLink.textContent = '加入书架';
newLink.href = `legado://import/addToBookshelf?src=${encodeURIComponent(firstLink.href)},{origin:'https://www.nvquge.com'}`;
// 添加 CSS 样式
newLink.style.display = 'block';
newLink.style.margin = '0 auto';
newLink.style.textAlign = 'center';
newLink.style.color = '#166188';

在此示例中，我们通过直接在新创建的 a 元素上设置 style 属性来为其添加 CSS 样式。请注意，CSS 属性名称是 JavaScript 属性名称的转换版本（例如：display 变为 style.display）。