Question

我有一个网页（静态），我必须将相同的 URL 作为链接重复 100 次以上。

示例：

Click this link to get help <a href='https://help.service.com'>Get help<a/>
Click this link to call for help <a href='https://help.service.com'>Get help<a/>
Click this link to text for help <a href='https://help.service.com'>Get help<a/>
Click this link to email for help <a href='https://help.service.com'>Get help<a/>
Click this link to radio for help <a href='https://help.service.com'>Get help<a/>

这是同一个网址。我想看看是否可以通过参数化 URL 来减小 html 的文件大小。

例如

Const url = 'https://help.service.com'
Click this link to radio for help <a href={url}>Get help<a/>

使用纯 JavaScript 可以实现这样的事情吗？

Answer 1

我不确定这有多大区别，但这正是您要寻找的。

将 class 的 link 添加到所有 a 标签并删除 href
使用 document.querySelectorAll 获取带有该 a 的所有 class 标签
遍历所有 a 标记并将 href 属性设置为 URL

const URL = 'https://help.service.com';
const links = document.querySelectorAll('.link');

links.forEach((link) => {
  link.href = URL;
})

Click this link to get help <a class="link">Get help<a/>
Click this link to call for help <a class="link" >Get help<a/>
Click this link to text for help <a class="link">Get help<a/>
Click this link to email for help <a class="link">Get help<a/>
Click this link to radio for help <a class="link">Get help<a/>

Answer 2

window.onload = function() {
   var linkTags = document.getElementsByClassName("link");
   var link = "https://linktoyoursite.com/";
   
   for (var i = 0; i < linkTags.length; i++) {
      linkTags[i].href = link;
    }

};

<a class="link">Ask for help</a>
<a class="link">Call for help</a>

对您希望相同的所有链接使用 class="link" 或类似的东西。然后选择像 var links = document.getElementsByClassName("link") 这样的所有元素。这将为您提供所有链接元素的数组。遍历数组并更改每个元素的 href 属性。

我将此放在事件 window.onload 上，该事件在 DOM 内容加载后立即触发。

参数化 URL 以便它可以重复使用

2 个答案: