时间戳

首页 > 解决方案 > Js在锚点中用@sometext替换链接文本

javascript - Js在锚点中用@sometext替换链接文本

问题描述

<li class="some-class one-more"><label>twitter:</label>
   <a href="https://twitter.com/sometext?s=09" target="_blank" rel="noreferrer noopener">https://twitter.com/sometext?s=09</a>
</li>

为此，输出类似于“https://twitter.com/sometext?s=09”，但我想要像@sometext 这样的输出。我对此很陌生，如果我犯了任何错误，请不要介意。提前致谢。

更新：这些链接都是动态生成的（由不同的用户添加），所以我无法更改特定的文本。例如：对于某些帐户，链接是这个，但对于其他一些帐户，链接会有所不同。

标签： javascripthtmljquery

解决方案

只需更改 a 标签内的文本。

<li class="some-class one-more"><label>twitter:</label>
   <a href="https://twitter.com/sometext?s=09" target="_blank" rel="noreferrer noopener">@sometext</a>
</li>

如果要动态更改链接，请添加以下脚本：

<script>
  document.querySelector('a[href="https://twitter.com/sometext?s=09"]').innerHTML = '@sometext';
</script>

此代码假定您的链接是唯一的，因此如果两个元素具有相同的 href 属性，则只会更改第一个元素。如果您不确定链接是否唯一或使用 id，请使用此选项。

<script>
  document.querySelectorAll('a[href="https://twitter.com/sometext?s=09"]').foreach((item)=>{
      item.innerHTML = '@sometext';
  });
</script>

您可以将其放在 for 循环中以更改多个链接的文本。使用数组它应该可以解决问题：

<script>
  var links = [
    ['a[href="https://twitter.com/sometext?s=09"]', '@sometext'],
    ['http://yourlink2', 'the text']
  ]

  links.foreach((item)=>{
    document.querySelector('a[href="'+item[0]+'"]').innerHTML = item[1];
  })
</script>

希望这会有所帮助。

推荐阅读