Ouvrir la page sur un onglet spécifique à l'aide du hachage d'URL

Question

Certes, je suis un peu perdu car je suis très nouveau dans le domaine des hachages, mais je pense que cela pourrait être une solution à mon problème, j'espère donc que quelqu'un ici aura plus d'informations. J'ai une page Web avec plusieurs "onglets" (un div qui masque les informations jusqu'à ce que l'on clique sur le bouton et un div qui masque toutes les autres informations jusqu'à ce que l'on clique sur le bouton) et je souhaite pouvoir ouvrir un onglet spécifique à partir de différentes pages Web. .< ;/p>

Ceci est le squelette de la page Web précédente. Lorsque vous naviguez régulièrement sur la page, le premier div est visible par défaut.

<div id="first" class="commission">
contenu
</div>

<div id="seconde" class="commission" style="display:none;">
contenu
</div>

<div id="troisième" class="commission" style="display:none;">
contenu
</div>

Sur cette page, vous trouverez des boutons sur lesquels vous pouvez cliquer pour basculer entre ces divs.

<button class="commissiontab" onclick="commissionType(event, 'first')">first</button>
<button class="commissiontab" onclick="commissionType(event, 'second')">Second</button>
<button class="commissiontab" onclick="commissionType(event, 'third')">Troisième</button>

Le javascript permettant de basculer entre ceux-ci est :

function commissionType(evt, commissionName) {
  var je,commissiontab;
  var x = document.getElementsByClassName("commission");
  pour (i = 0; i < x.length; i++) {
    x[i].style.display = "aucun" ;
  }
  commissiontab = document.getElementsByClassName("commissiontab");
  pour (i = 0; i < x.length; i++) {
    commissiontab[i].className = commissiontab[i].className.replace("sélectionné", "");
  }
  window.scrollTo({ top : 0, behavior : 'smooth' });
  evt.currentTarget.className += "sélectionné";
  document.getElementById(commissionName).style.display = "grid";
}
 D'une manière ou d'une autre, je souhaite placer ces boutons sur une page différente ("index.html"), mais lorsque vous cliquez sur le "troisième", vous êtes redirigé vers une nouvelle page ("commissiontypes.html") "Troisième" à la place. du "Premier" par défaut. 
S'il existe d'autres solutions que l'utilisation de hachages, j'aimerais en entendre parler, merci d'y regarder de plus près. 
            

Answer 1

Vous pouvez dans un premier temps utiliser 'commission' 类隐藏所有元素，然后在页面加载时根据 location.hash pour afficher un seul des éléments. De cette façon, commissiontypes.html (et commissiontypes.html#first) affichera le premier div, commissiontypes.html#second affichera le deuxième div, etc

document.querySelectorAll('.commission').forEach(x => x.style.display = 'none');
const activeEl = document.querySelector(location.hash || '#first');
activeEl.style.display = '';

(Vous pouvez également envisager d'utiliser des paramètres de requête pour indiquer cette section.)