直接到另一個頁面，同時更改該頁上的類

Question

我有兩個html頁面，我需要鏈接到第二頁的第一頁，然後修改第二頁上的一個元素的類。

例如..頁面1有2個按鈕，如果您按第一個按鈕，則您將指向第二個頁面，第二個頁面背景將變爲綠色。如果按下第二個按鈕，您將按照相同的方式操作，但背景變爲藍色。

有沒有辦法做到這一點？不使用jQuery。

Answer 1

您可以通過查詢字符串傳遞參數並使用第2頁上的document.location.search來獲取參數並相應地設置顏色。

<a href="page2.html?color=green">Green</a> 
<a href="page2.html?color=blue">Blue</a> 

然後在第2頁：

<script> 
    // Assuming the query string is ?color=blue, 
    // splitting on = will result in ["?color", "blue"]. 
    // In the real world you shouldn't assume it's in 
    // exactly that format, but for the sake of example... 

    var color = window.location.search.split('=')[1]; 

    // add the css class 'blue' to the body tag. 
    var document.body.classList.add(color); 
</script> 

而且在CSS：

.blue { 
    background-color: blue; 
} 

.green { 
    background-color: green; 
}