通過引用外部頁面的錨點擴展隱藏的div

Question

我有一個腳本，可在頁面加載時在列表中隱藏（顯示：無）某些div。 Div的內容表示一本書的描述，整個列表是某種書目。 每個div都有一個ID，例如“ div1”，“ div2”等。

<ul>  
<li><div class="hidden" id="div1"></li>  
<li><div class="hidden" id="div1"></li>   
...  
</ul> 

還有另一個帶有菜單的頁面，其中包含指向每個此類div的錨定鏈接：

<ul>  
<li><a href="bibl.html#div1"></li>  
<li><a href="bibl.html#div2"></li>  
...  
</ul>  

單擊另一個頁面上的鏈接時，我希望隱藏的div自動展開。 我嘗試了一些window.location.href東西，但無濟於事-我的JS很弱。 據我了解的邏輯，它應該使用當前的URL並檢查它是否為“＃”，然后在id屬性中搜索具有右側部分的元素。 非常感謝善良的人。）

Answer 1

您可以在目標頁面上執行以下操作：

window.onload = function() {
    var hash = window.location.hash; // would be "#div1" or something
    if(hash != "") {
        var id = hash.substr(1); // get rid of #
        document.getElementById(id).style.display = 'block';
    }
};

本質上，您可以在頁面加載中檢查窗口的href是否附加了哈希。 如果是這樣，您將找到<div>並將樣式顯示更改為block。

Answer 2

您可以使用window.location.hash查看哈希值。 從那里您可以getElementById(hashValue)並顯示getElementById(hashValue) 。

Answer 3

謝謝！ 我知道你可以添加這個

location.href = '#' + id;

並將頁面滾動到引用的div的位置。