Html 同一页面内的锚不起作用？

我正在尝试链接到我页面的HTML中的元素，但它不起作用，我不确定为什么

以下是初始链接：

<ul>
        <a href="#"><li>About Me</li></a>
        <a href="#"><li>Past</li></a>
        <a href="#Work"><li>Work</li></a>
        <a href="http://blog.tommaxwell.me"><li>Blog</li></a>
    </ul>

我希望列表中的所有li都是指向页面上其他地方的链接（最后一个除外）

在这段代码的顶部，我试图链接到：

<div id="Work">
    <a name="Work"><h2 id="work-title">Work</h2></a>
        <ul>
            <li>
                <h3>BrainDB</h3>
                <p>BrainDB is a new startup I'm working on with my co-founder, <a href="http://www.twitter.com/masonlong" id="mason">@masonlong</a>. I write everything from Rails to AngularJS and CSS. BrainDB's goal is to augment the mind with useful and inviting services.</p>
            </li>

            <li>
                <h3 id>SummarizeIt</h3>
                <p><a href="http://54.225.211.118/" id="summarize">SummarizeIt</a> is a JavaScript project that I built during a weekend. It utilizes an API for summarizing content, like blog posts, into bit-sized chunks. </p>
            </li>

            <li>
                <h3>Freelance</h3>
                <p>I freelance from time to time. I work with personal clients, as well as through <a href="https://www.elance.com/s/tommaxwell/?utm_medium=social&utm_source=twitter&utm_campaign=free&SiteTarget=share_profile&utm_term=3712117" id="elance">Elance</a>. I'm <a href="mailto:tommaxwell95@gmail.com" id="email">available</a>.</p>
            </li>
        </ul>
    </div>

. 我写从Rails到AngularJS和CSS的所有东西。BrainDB的目标是用有用且诱人的服务来增强心智



综述
是一个JavaScript项目，我在一个周末创建的。它利用一个API将内容（如博客文章）汇总成小块



自由职业的
我有时是自由职业者。我与个人客户一起工作，也通过。我很高兴

---

我链接到的区域是否必须使用分区标记？我有多个有ul的div

您好，您必须使用'a href'调用'a id'

以下是一个例子：

<a href="#Works">My Works</a>

它将呼吁：

<a id="Works">Works</a>

---

锚需要有工作的ID或名称，但您使用了两次



（目标点）
指定的主播
像这样在li标签中使用锚定标签

<ul>
    <li><a href="#id">about</a></li>
    <li><a href="#work">work</a></li>
    <li><a href="#id">blog</a></li>
</ul>







像这样的
您的链接id如下所示

<div id="work">
</div>


试试这个

<a href="#About"></a>



现在如果你想把它链接到底部的某个地方

<a name="About">(Make Sure There Is Not Text here)</a>About Section.

（确保此处没有文本）关于节。
这很重要。如果锚定的href是页面相关的（以
#
开头），锚定将不会在所有页面上工作，在标题中有标记
（但根页面）

例如，您在页面上：


页面上的基本标记如下所示：

<base href="https://example.com">

<a href="pagename.html##anchorname">Word as link you want people to click</a>

<a name="#anchorname">Spot you want to appear at top of page once link is clicked</a>



在本页的代码中有一个锚点：

<a href="#anc">anchor</a>



使用base标记，它将跟随到，而不是预期的

要解决此问题，可以执行以下操作之一：

使用域相对锚定
使用javascript重载锚定单击并将url交换到相对域
删除基本标记-它通常未使用
我也遇到了这个问题（使用链接进行相同的页面导航），解决方案非常简单（尽管很难解决）。我希望这能有所帮助——我也检查了IE、Firefox和Chrome，它在所有方面都起到了作用（截至2019年5月22日）

您的链接应如下所示：

<base href="https://example.com">

<a href="pagename.html##anchorname">Word as link you want people to click</a>

<a name="#anchorname">Spot you want to appear at top of page once link is clicked</a>



你的锚应该是这样的：

<base href="https://example.com">

<a href="pagename.html##anchorname">Word as link you want people to click</a>

<a name="#anchorname">Spot you want to appear at top of page once link is clicked</a>

单击链接后，您希望显示在页面顶部的点

我今天遇到了这个问题。另外，我想顺利滚动到锚，这是什么拯救了我的一天。“问题”可以像@Alexander Goncharov在回答中指出的那样指向标签

document.querySelectorAll（'a[href^=“#”]”）。forEach（anchor=>{
anchor.addEventListener（'click'，函数（e）{
e、 预防默认值（）；
document.querySelector（this.getAttribute（'href'））.scrollIntoView({
行为：“平滑”
});
});
});

---

我找到了这个解决方案

在我的案例中，我找到了以下解决方法：

而不是

<base target=_blank>

我说：

<base href=. target=_blank>

修改后，指向文件的外部链接正确跳转到定位点：

---

看不出它有什么问题，除了，你是否运行了可能会劫持你链接的框架？这里有什么问题吗？我必须检查一下，看看我使用的任何东西是否可能是原因。这是jQuery Mobile。谢谢你，简！您正在哪个浏览器上测试此代码？似乎在Firefox 40#3上工作是个坏建议。也许您很少在项目中使用它们，但它们并不少见；）@当布局中没有基本标签时，它更有秩序。但是，如果你删除了基本标签，是的，你可以破坏一些东西：修复速度很快，但事实上你找不到它。对于可能没有意识到删除它的潜在影响的新手用户来说，这仍然是一个糟糕的建议；）FWIW，我遇到了这个问题，这就是解决方案。我的场景可能是独一无二的，因为我提供的是通过Mustashe生成的S3静态文件。我使用的基本模板是一个呈现角度的页面，并且我的基本标记仍然在原位。移除它可以让我的内部锚完美地工作。使用底座一点也不常见。假设我们有下一个url:somedomain/article.php？id=4，它可以转换为somedomain/article/4。但是，浏览器会考虑每个相对资源（图像）指向文件夹article/4