更改HREF中的URL，並以“屏幕分辨率”作為測試

Question

需要幫助，希望可以使用JavaScript處理測試/結果代碼。 首先，我不是程序員，並且完全迷路了，因此，如果可以的話，我將需要所有編碼。

我的困境是，我正在構建一個子域（即：subname.mainsite.com），並使用它來測試Bootstrap-CSS / JavaScript組合系統，以使頁面根據屏幕分辨率動態更改布局。 對於所有設備（PC，平板電腦，移動設備）使用一頁。

但是，我需要將子域超文本鏈接轉到一個電子商務網站，該網站仍將單獨的頁面用於移動和計算機屏幕分辨率，因此一個鏈接將必須具有兩個URL，具體取決於頁面當時所在的屏幕分辨率。點擊。

由於頁面上的多個鏈接會不斷變化，因此可以在頁面的“ Head”標記中放入JavaScript代碼，以便在頁面上建立超文本鏈接時執行該操作頁面上該點的測試，例如：“如果屏幕分辨率為786px或更小，請使用[此URL]，否則（對於大屏幕/非移動尺寸）請使用[此URL]”

我試圖避免建立鏈接數據庫，因為它會根據內容及其在頁面上的位置而不斷變化。 我在頁面上同時使用了文本和HTML按鈕，它們使用傳統的“ a href =“標簽作為鏈接。 希望這足以為有人提供幫助的解釋。 謝謝。

Answer 1

這很簡單，這是一個例子。

<a id="myLink" href="http://highresolutionurl">My Link</a>

這段JavaScript：

<script>
if (screen.width < 768) {
    document.getElementById('myLink').setAttribute('href', "http://lowresolutionurl");
}
</script>

我認為即使非程序員也可以理解代碼。

Answer 2

您要問的很簡單。 在發布此類問題之前，您應該進行更多調查。 在Stackoverflow中，我們不會為他人工作，我們會幫助解決。

我編寫的代碼是一個一般示例，您希望此代碼更好地工作的方式是此貼子的第二個答案。

<script>
    var anchors = document.getElementsByClassName('anchors-that-redirect-to-resolution-website'); // Example, it could even be anchor tags as well.
    var screen_resolution = window.innerWidth;

    for (i = 0; i < anchors.length; i++) {             
        anchors[i].addEventListener('click', function() {
            if(screen_resolution < 768){
                window.location = "your_desired_custom_url";
            } else {
                window.location = "your_desired_custom_url";
            }
        });
    }
</script>