AMP 如何從帶有 ref 的鏈接動態獲取 href

Question

我處於一種情況，我想從我的AMP 網頁的規范url 獲取href並將其添加到一個AMP 按鈕，點擊按鈕后，事件會打開一個帶有規范 URL 的新頁面。

我想通過代碼動態地做到這一點。

我可以使用 amp-binding，但我不想向規范 URL 添加任何 amp-binding。

這是我的AMP代碼的規范網址，我想導航到銷售按鈕被點擊之后。

注意：在 AMP 中，您點擊一個按鈕，然后會觸發一個操作，這與HTML中您所說的click 不同。

有誰知道如何做到這一點，並告訴我如何做到這一點？

 <link rel="canonical" href="https://mysaleswebsite.com/salepage.php"/> <div align="center" class="img-wrapper"> <amp-img on="tap:AMP.navigateTo(url='GET_URL_FROM_CANONICAL_LINK#productX', target='_blank', opener=true)" src="img/salesbuttonpicture.jpg" height="50" width="100" alt="Sales Page"> </amp-img> </div>

Answer 1

我要做的第一件事是給出相應的標簽 ID。

<link id="canonicalUrl" rel="canonical" href="https://mysaleswebsite.com/salepage.php"/>
<amp-img id="ampButton" src="img/salesbuttonpicture.jpg" height="50" width="100" alt="Sales Page"></amp-img>

然后，您可以引用這些元素 ID 的屬性來相應地獲取和分配 URL。

<script>
    const canonicalUrl = document.getElementById('canonicalUrl').href;
    document.getElementById('ampButton').setAttribute("on", "tap:AMP.navigateTo(url='" + canonicalUrl + "#productX', target='_blank', opener=true)'")
</script>

我對 AMP 一無所知，也不知道這是否會做任何無法預料的事情。