Extension d'une div masquée en se référant à une ancre depuis une page externe

Question

J'ai un script qui masque (affichage: aucun) certaines divs dans la liste au chargement de la page. Le contenu de la Div représente la description d'un livre, et toute la liste est une sorte de bibliographie. Chaque div a un id, par exemple, "div1", "div2", etc.

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

Et il y a une autre page avec un menu qui se compose de liens ancrés à tous un tel div:

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

Je souhaite que la div masquée expire automatiquement lorsque le lien sur une autre page est cliqué. J'ai essayé quelques trucs window.location.href, mais en vain - mon JS est encore faible. Comme je comprends la logique, il devrait prendre l'URL actuelle et la vérifier pour "#", puis rechercher un élément avec la partie à droite dans l'attribut id. . Merci beaucoup de gens gentils)

Answer 1

Vous pouvez faire quelque chose comme ceci sur la page cible:

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'; 
    } 
}; 

Essentiellement, vous vérifiez la charge page si href de la fenêtre a un hachage attaché. Si c'est le cas, vous trouvez le <div> et changez l'affichage du style à bloquer.

Answer 2

Vous pouvez utiliser le window.location.hash pour voir la valeur de hachage. De là, vous pouvez getElementById(hashValue) et le montrer.

Answer 3

Merci! Je ai compris que vous pouvez ajouter ce

location.href = '#' + id; 

et également faire défiler la page à la position de la div visée.