如何将基本标签限制为某些超链接

Question

我正在使用带有iframe 标记的base 标记，我想知道如何限制在iframe 中打开的某些链接。

例如，我有一个菜单面板，当单击菜单链接时，所需的页面会显示在 iframe 中。

<div class="start">
    <h1 class="start">Geek Box <img src="box_icon.png" alt="Box width=" 40" height="40"></h1>
    <hr />
</div>
<div class="table">
    <table class="table" border="1" align="center">
        <tr>
            <td>
                <a href="index.html">Home</a>
            </td>
            <td><a href="Chart.html">Tech Charts</a></td>
            <td><a href="Video.html">Videos</a></td>
            <td><a href="About Me.html">About Me</a></td>
        </tr>
    </table>
</div>
<hr />
<br />

<div>
    <table border="1" width=100% height="500px" style="text-align:center">
        <tr>
            <td width="25%"><a href="phone.html">Smart Phones</a></td>
            <td width="25%"><a href="laptop.html">Laptops</a></td>
            <td width="25%"><a href="Desktop.html">Dektops</a></td>
            <td width="25%"><a href="Tablets.html">Tablets</a></td>
        </tr>
        <base target='display' />
        <tr><td colspan="4"><iframe name="display" frameborder=0 width="100%" height="500px" /> </td></tr>
    </table>
</div>

Answer 1

如果我理解正确，您希望某些页面在iframe 中打开，而其他页面在同一窗口或另一个窗口（或任何其他方式）中打开，即。 不是在iftame中。

这不适用于使用您的示例的 base 标记，因为...

HTML <base> 元素指定用于文档中包含的所有相对 URL 的基本 URL。

...还有

一个文档中只能有一个<base> 元素。

...所以使用另一个 base 标记不会使其按您想要的方式工作。

相反，您必须去掉base 标记，并将target 属性添加到您希望出现在iframe 中的每个链接。

因此，假设您只想打开iframe 中的“子菜单”（至少它们看起来，即电话、笔记本电脑...等），我建议您将代码更改为：

<div>
    <table border="1" width=100% height="500px" style="text-align:center">
        <tr>
            <td width="25%"><a href="phone.html" target='display'>Smart Phones</a></td>
            <td width="25%"><a href="laptop.html" target='display'>Laptops</a></td>
            <td width="25%"><a href="Desktop.html" target='display'>Dektops</a></td>
            <td width="25%"><a href="Tablets.html" target='display'>Tablets</a></td>
        </tr>
        <!-- Notice I have removed the 'base' tag! -->
        <tr><td colspan="4"><iframe name="display" frameborder=0 width="100%" height="500px" /> </td></tr>
    </table>
</div>

...您可以保持其余代码不变。

引用来源：<base - HTML | MDN