html - 用 ALT 标记和占位符文本替换所有 HREF URL 属性

Question

我需要找到一种自动方法来更新 HTML 文件中的 href URL，其中包含锚标记包装的相应图像 alt 文本，同时还包括前导和结束 RPL 文本。

开始：

<a href="https://www.google.com"><img src="/images/image.jpg" alt="ALT_TEXT"></a>
End:
<a href="${clickthrough('ALT_TEXT')}"><img src="/images/image.jpg" alt="ALT_TEXT"></a>

分解新网址：

• 第一个变量：${clickthrough('<br>
• 第二个变量：ALT_TEXT<br>
• 第三个变量：')}

任何人都知道我应该从哪里开始为这个问题设计解决方案？什么编码语言可以处理这个问题？

标签： htmlhrefalt

Answer 1

您正在寻找的语言是 JavaScript。

这是一个可以完成您提到的工作的示例。（这是一个具有相同示例的代码笔）

const anchorElements = document.querySelectorAll('a');
[...anchorElements].forEach((anchor) => {
  const altText = anchor.querySelector('img').alt;
  anchor.href = "${clickthrough('" + altText + "')}";
})

<a href="https://www.google.com"><img src="https://place-hold.it/300x100" alt="text1"></a>
<a href="https://www.google.com"><img src="https://place-hold.it/300x100" alt="text2"></a>
<a href="https://www.google.com"><img src="https://place-hold.it/300x100" alt="text3"></a>