作为人工探索性测试人员，了解 HTML 锚点对于确保网页正常运行和提供无缝用户体验至关重要。HTML 内部锚点通常被称为超链接或链接，可帮助用户浏览网站的不同页面和部分。在本文中，我们将全面介绍 HTML 内部锚点及其在我们测试类型中的重要性。

要了解我们将要分析的元素，就必须知道如何检查这些元素。检查 DOM 元素包括使用浏览器开发工具来了解网页结构。这对于手工探索性测试人员来说至关重要，因为它可以帮助我们发现问题、验证交互和评估用户体验。

如果您想了解如何使用浏览器开发工具，请参阅我们的文章浏览器控制台。

HTML 锚点创建可点击链接，允许用户从一个页面移动到另一个页面，或跳转到页面中的特定部分。锚点使用 HTML 中的 a 标签定义，由两个主要属性组成：href 和 text。href 属性指定目标 URL 或目标，而 text 属性则定义用户交互的可见链接文本。

例如，请参阅我们网站上 BECOME A TESTER 按钮的 HTML 锚点：https://test.io/：

请阅读文章，了解如何阅读和理解 URL 结构。

HTML 锚点有两种类型：外部锚点和内部锚点。

外部锚点可引导用户访问当前网站域外的资源。它们用于引导用户访问其他网站或外部内容。

就像 https://test.io/ 页脚中的Tester Academy 链接一样：

另一方面，内部锚点允许用户在同一网站内导航，跳转到当前页面的特定部分或同一网站内的不同页面。

例如，这是 https://test.io/ 上的页脚元素 ❝Policies for Testers❞：

该元素用于在同一文章页面错误报告要求中链接到错误报告❝Title❞部分：

作为 Test IO 的自由测试员，您在确保网站上的所有链接都能正常工作并提供流畅的用户体验方面发挥着至关重要的作用。以下是了解 HTML 锚点在测试中的重要性的原因：

a. 功能测试： 探索性测试人员的主要职责之一是确认所有内部和外部链接都能正常工作。断开的链接会造成令人沮丧的用户体验，并对网站的可信度产生负面影响。

b. 导航测试： 内部锚点应将用户导向页面中的正确部分。我们必须确保点击内部链接能将用户带到同一页面或其他页面的预期位置。

c. 链接文本验证： 我们需要验证链接文本是否准确表达了其指向的内容。误导性或不相关的链接文本会让用户感到困惑，降低他们对网站的信任度。

d. 跨浏览器兼容性：HTML 锚点在不同浏览器上的表现可能不同。我们必须进行跨浏览器测试，以确保链接在所有主要浏览器上都能统一运行。

e. 移动响应性： 随着越来越多的用户使用移动设备访问网站，我们需要检查链接是否能在不同尺寸和方向的屏幕上正常运行。

由于外部锚点的一般链接结构与 a 标签及其属性 href 和 text 相同，我们来深入研究一下内部锚点，因为在测试时还需要分析它们的其他属性。

内部锚点（也称为片段标识符或命名锚点）允许用户导航到同一页面上的部分，而不是将用户引导到不同的页面。最常见的例子是在测试目录时，目录链接到特定部分，这样读者就可以跳转到同一页面上的部分或内容块，或者在点击电子邮件地址时，用户导航到电子邮件服务，从而节省时间并增强用户体验。

要创建内部锚点，必须为目标部分的 HTML 元素定义 id 属性。然后，就可以在锚链接的 href 属性中引用该 id 属性，并在前面加上哈希（#）符号。尽管 ID 是最直接的实现方式，但锚也可以使用类名。

如上文错误报告要求一文中 ❝Title❞ 的示例所示，其引用方式如下： #h_f4796ee256

通过使用浏览器的DevTools，可以更容易地发现这些元素，从而在测试时更好地找出错误的根本原因。

让我们确定使此导航成为可能的元素。 在错误报告要求的顶部，有一个段落包含锚点 href 属性：<a href=" #h_f4796ee256">Title</a>

在底部， ❝Title❞部分包含 id 属性，即上述锚点的目标，它可以在同一页面上进行导航，显示为 <h1 id="h_f4796ee256">Title</h1> 。

这些问题通常涉及 HTML 属性缺失或拼写错误，或者完全没有元素（信息缺失）。虽然它们看起来像链接，而且可以点击，但对功能影响不大，因此被视为"内容错误"。

说到网页开发，HTML 锚点起着至关重要的作用。作为一名质量保证测试人员，必须了解锚点的意义，以便进行有效的手动探索性测试。通过进行全面的测试并遵循最佳实践，您可以帮助确保用户获得无缝的浏览体验，并为网站的整体成功做出贡献。