单击窗口特定部分中的菜单栏按钮后，我们如何打开 Html 页面

Question

单击菜单后，特定的html页面应该在窗口的一部分打开，如何使用div标签执行此操作？你能告诉我一些例子吗？现在我正在 Frame 标签的帮助下执行此操作，但还有另一种选择提前谢谢。

Answer 1

如果我

理解正确，您想通过单击按钮在页面上打开一个包含html的弹出窗口，您可以这样做

function openHtml()
{
   document.getElementById("html_block").innerHTML = "YourHTML..."; //simple way
   //$("#target_div").load("YOUR_PAGE.html"); //you can also use this to load html from file using jquery
}

.main_page
{
 width: 100%;
 height: 200px;
 background: grey;
 position: relative;
}
#html_block
{
  position: absolute;
  background: red;
  left: 80%; /*your specific position*/
  bottom: 10px;
}

<div class="main_page">
  <button onclick="openHtml()">open html</button>
  <div id="html_block"></div>
</div>

Answer 2

您必须使用 id 包含对要定位的div 的引用，例如：

<a href="https://getbootstrap.com/docs/4.1/components/card/#list-groups">Link</a>

您可以在那里看到，最后一部分说#list-group，这是对 Bootstrap 组件页面中id list-groups的部分的引用;您必须执行相同的操作;为要转到的部分指定一个 ID;当页面打开时，它将转到该部分。

所以像这样：

<a href="another_page/#your_section_id">Link</a>

将打开该页面并定位该页面上包含以下内容的部分：

<div id="your_section_id"></div>