在点击 Javascript 之前执行按钮方法

Question

document.write(
  '<button class="list" href="#X1" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle"> Home </button>'+
  '<div class="collapse list-unstyled" id="X1">'+
     '<a href="'+myArray[0][0]+'" class="'+myArray[0][1]+'" > Site 1 </a> '+
     '<a href="'+myArray[1][0]+'" class="'+myArray[1][1]+'" > Site 2 </a> '+
  '</div>'
);

I have a Navigation Menu with submenus full of links. Whichever page the user is currently in, i want the particular submenu to be expanded (By Default it will be compressed)

In the above code, when the user clicks on a menu item, the submenus will open up. Is there anyway i can open up this submenu without user clicking on it. Using BOOTSRAP SideNav for Navigation, so a bit confused

Setting aria-expanded="false" to aria-expanded="true" does not work

Answer 1

You can add class show to the div.collapse that you want to expand.

Example:

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script> <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample"> Menu </a> <div class="collapse show" id="collapseExample"> <div class="card card-body"> Submenu </div> </div>