浏览网页
在本模块的这个阶段，你应该已经在你的计算机或其他可用设备上安装了多个现代 Web 浏览器。本文将更深入地探讨浏览器的使用，介绍 Web 浏览器的工作原理、你将与之交互的一些日常事物的区别，以及如何搜索信息。
注意： 如果你除了设备自带的默认浏览器外没有安装任何其他浏览器，请安装一些。更多信息请参阅现代 Web 浏览器。
与任何知识领域一样，Web 也有大量的行话和技术术语。别担心：我们不会一开始就让你不知所措（如果你好奇，可以查阅术语表）。然而，有一些基本术语你需要从一开始就理解，因为你会经常听到这些表达。下面我们介绍一些重要术语。
| 预备知识 | 基本熟悉你的计算机操作系统。 |
|---|---|
| 学习成果 |
|
网页、网站、Web 服务器和搜索引擎的区别
我们将从描述各种与 Web 相关的概念开始：网页、网站、Web 服务器和搜索引擎。这些术语经常被 Web 新手混淆或错误使用。让我们确保你了解它们各自的含义！让我们从一些定义开始
- 网页
-
可以在 Web 浏览器中显示的文档。这些通常也被简称为“页面”。此类文档是用 HTML 语言编写的（我们稍后会更详细地介绍）。
- 网站
-
一组网页集合在一起成为一个单一的资源，它们之间通过链接相互连接。通常被称为“站点”。
- Web 服务器
-
一台在互联网上托管网站的计算机。
- Web 服务
-
一种通过互联网响应请求以执行功能或提供数据的软件。Web 服务通常由 Web 服务器支持，并可能提供网页供用户交互。许多网站也是 Web 服务，尽管一些网站（如 MDN）仅包含静态内容。Web 服务的例子包括调整图片大小、提供天气预报或处理用户登录等。
- 搜索引擎
-
一种帮助你查找其他网页的 Web 服务，如 Google、Bing、Yahoo 或 DuckDuckGo。搜索引擎通常通过 Web 浏览器访问（例如，你可以直接在 Firefox、Chrome 等的地址栏中进行搜索引擎搜索）或通过网页访问（例如，bing.com 或 duckduckgo.com）。
让我们看一个类比——一个公共图书馆。这是你在访问图书馆时通常会做的事情
- 找到一个检索目录，查找你想要的书名。
- 记下这本书的目录号。
- 去到包含这本书的特定区域，找到正确的目录号，然后拿到书。
让我们将公共图书馆与 Web 进行比较
- 图书馆就像一个 Web 服务器。它有几个区域，这类似于一个托管多个网站的 Web 服务器。
- 图书馆中的不同区域（科学、数学、历史等）就像网站。每个区域就像一个独特的网站（两个区域不会包含相同的书籍）。
- 每个区域中的书籍就像网页。一个网站可能包含多个网页，例如，科学区（网站）将有关于热、声、热力学、人体生物学等方面的书籍。
- 检索目录就像搜索引擎。每本书在图书馆中都有其独特的存放位置（两本书不能放在同一个地方），该位置由目录号指定。
现在让我们花点时间更详细地看一下每个术语。
网页
网页是一个可由浏览器显示的简单文档。网页可以嵌入各种不同类型的资源，例如
- 样式信息——控制页面的外观和感觉。
- 脚本——为页面增加交互性。
- 媒体——图片、声音和视频。
注意： 浏览器也可以显示其他文档，如 PDF 文件以及其他资源，如图片或视频，但网页这个术语特指 HTML 文档。
所有网页都可以在一个唯一的位置找到（网址，也称为 URL）。要访问一个页面，只需在浏览器地址栏中输入其地址
现在，请记住我们上面所说的，尝试在浏览器中加载一个你最喜欢的网站。你是自己输入网址，还是通过搜索引擎找到的？
网站
网站是共享一个唯一域名的链接网页（及其相关资源）的集合。一个给定网站的每个网页都提供明确的链接——大多数时候以可点击的文本部分的形式——允许用户从网站的一个页面移动到另一个页面。
当你在浏览器中加载你喜欢的网站时，它通常首先显示网站的主网页，或主页（通俗地称为“home”）
尝试点击一些菜单项或链接，查看你最喜欢的网站上的一些不同页面。注意当你切换页面时，显示的网址是如何变化的。
注意： 也有可能是单页应用：一个由单个网页组成的网站，需要时会动态更新新内容。如果是这种情况，当查看不同页面时，网址可能不会改变。
Web 服务器
Web 服务器是一台托管一个或多个网站的计算机。“托管”意味着所有的网页及其相关文件都可以在那台计算机上找到。当用户尝试加载它托管的网页文件时，Web 服务器会将其发送到用户的浏览器。
不要混淆网站和 Web 服务器。例如，如果你听到有人说，“我的网站没有响应”，这可能意味着 Web 服务器没有响应，因此网站不可用。
更重要的是，由于一个 Web 服务器可以托管多个网站，Web 服务器这个术语不再用来指代一个网站，因为它可能会引起混淆。如果有人说“我的 Web 服务器没有响应”，这可能意味着该 Web 服务器上托管的多个网站或应用程序都不可用。
搜索引擎
人们常常把搜索引擎和网站混淆。搜索引擎是一种特殊的 Web 服务，帮助用户找到他们感兴趣的网页，以及特定类型的内容，如图片、视频或新闻文章。
搜索引擎通常都有自己的网站，可以用来访问底层的 Web 服务。有很多这样的搜索引擎：Google、Bing、Yandex、DuckDuckGo 等等。有些是通用的，有些则专注于特定主题。
许多 Web 新手会混淆搜索引擎和浏览器。让我们明确一下
- 浏览器是一个检索和显示网页的软件。
- 搜索引擎是一个帮助人们找到其他网站上的网页的 Web 服务（通常也是一个网站）。
这种混淆的产生是因为，当某人第一次启动浏览器时，浏览器通常会显示一个搜索引擎的网站主页或一个搜索框，允许他们使用该搜索引擎搜索一个词条。大多数浏览器也允许用户通过直接在浏览器地址栏输入搜索词条来使用搜索引擎。
这一切都很有道理，因为人们通常想用浏览器做的第一件事就是找到一个要显示的网页。不要把软件（浏览器）和其服务（搜索引擎）混淆了。
这里是 Firefox 将 Google 搜索框作为其默认启动页面的一个实例
尝试使用搜索引擎查找你感兴趣的主题的信息，方法是
- 访问一个搜索引擎主页并输入一个搜索词条。
- 在浏览器地址栏中输入一个搜索词条。
Web 是如何工作的：基础知识
在世界许多地方，Web 已经成为我们日常生活中像餐具、自行车和汽车或牙刷一样必不可少的工具。如果这听起来不现实，就想想你每天使用网站或手机应用的频率吧！即使你没有在 Web 浏览器中输入网址来访问内容或服务，你正在使用的应用很可能在幕后使用 Web 技术来获取数据并呈现给你。
当你访问 Web 时，从你的第一次交互（例如，在浏览器中输入网址（URL）并按 Enter/Return）到你的操作结果呈现给你（例如，网站出现在你的 Web 浏览器中）之间，发生了很多事情。
- Web 浏览器从存储资源的 Web 服务器请求你想要访问的资源（例如，网页、一些数据或图片或视频）。这类请求（以及由此产生的响应）是使用一种名为 HTTP（超文本传输协议）的技术进行的，它使用一种动词语言（如 GET）来描述应该发生什么。
- 如果请求成功，Web 服务器会向 Web 浏览器发送一个包含所请求资源的 HTTP 响应。
- 在某些情况下，被请求的资源会触发更多的 HTTP 请求，从而产生更多的响应。例如
- 当一个网站被加载时，首先请求的是该网站主页的主索引 HTML 文件。
- 当浏览器接收到该文件时，它会开始解析它，并且很可能会发现更多请求的指令。如上所述，这些可能是要嵌入的文件，如图片、样式信息、脚本等。
- 当所有资源都被请求后，Web 浏览器会根据需要解析和渲染它们，然后将结果显示给用户。
这个关于 Web 工作原理的描述被大大简化了，但这是你在现阶段需要知道的全部。你将在我们的Web 标准模块中稍后找到关于 Web 浏览器如何请求和渲染网页的更详细的说明。
搜索信息
作为一名 Web 开发人员，你将花费大量时间搜索信息，从你记不住的语法到特定问题的解决方案。因此，学习如何有效地搜索 Web 是一个好主意。
如果你知道一个专门针对你正在学习的主题的网站，从那里开始通常是个好主意。
例如，如果你正在寻找关于某个特定 Web 技术特性的一般信息，你应该在 MDN 搜索框中输入该特性的名称。例如，尝试在搜索框中输入 box model、fetch() 或 video element，看看会出现什么。如果你没有找到你需要的信息，就扩大你的搜索范围——在搜索引擎中尝试你的搜索词条。
如果你正在寻找特定问题的解决方案，例如如何用 JavaScript 打印斐波那契数列或如何用 JavaScript 计算一个数是否是质数，最好在像 StackOverflow 这样的网站上搜索，这是一个致力于回答编程问题的社区。同样，如果一个特定的网站没有给你一个有用的答案，就尝试使用一个通用的搜索引擎。
在你继续之前，尝试搜索一些你自己想学习的主题。尝试使用更具体和更宽泛的搜索以及不同的相关术语，看看哪种效果最好。请参阅我们的搜索技巧了解更多可以尝试的方法。
使用 AI
AI 生成的搜索结果是一种非常流行的获取信息的方式。它们基本上提供了一种超级搜索：它们在后台进行大量搜索，然后将结果编译成一个单一的、易于理解的答案。常见的选择有 ChatGPT、Google Gemini 和 Microsoft Copilot，可以通过聊天格式直接访问，也可以通过 AI 驱动的应用内帮助或自动化系统访问。
在学习编程时，AI 聊天提示在多种方面都很有用
- 进行常规搜索，就像上面的例子一样。
- 找出一块代码中的错误。如果你因为代码不工作而感到沮丧，你可以将你的代码粘贴到 AI 聊天提示中，并在前面加上一个问题，比如
这段代码的错误在哪里？ - 生成特定代码块的优化版本。当你写了一段可以工作的代码，但想知道如何能更高效地完成，或者用更健壮的方式解决更多用例时，这很有用。
- 提供关于如何做某事的建议。例如，如果你不仅想知道一段代码中的错误在哪里，还想知道应该使用什么策略来调试它。
尝试使用一些 AI 工具进行一些搜索。
一个警示故事
AI 能做的事情太多了，你可能会开始怀疑为什么你还需要学习编程。
但是等等！以下内容很重要：你仍然需要从高层次理解你想要做什么，代码在做什么，以及每一段代码需要用在哪里。如果你不这样做，在尝试解决现实世界问题时，你将不会很有用。这意味着你仍然需要学习编程。AI 可以是一个非常有用的工具，帮助你更快地找到答案，但如果你只是把你被问到的每个问题都输入到 AI 提示中，你将不会理解任何东西是如何工作的。
此外
- AI 工具以一种自信、权威的语气呈现它们的答案，但它们常常会误导人或者干脆就是错的。它们犯的一些错误可能非常微妙。它们没有任何天生的智能——它们基本上是先进的模式匹配工具。AI 工具从其他来源编译它们的答案，所以它们会吸收错误的信息和正确的信息。即使是两个正确的来源也可能被组合成一个不正确的答案。
- 较新的信息可能无法获得，或者答案可能偏向于更旧、更普遍的文档，所以“如何用 JS 做 X”可能会给你过时的指导。
因此，你需要仔细检查它们给出的答案，而不仅仅是毫无疑问地相信一切。
在学习时，花时间自己尝试解决问题，然后再去寻找答案，无论你是使用 AI 还是传统的搜索引擎。这会让你成为一个更好的开发者。
搜索技巧
-
你应该在搜索词中包含你正在使用的语言，如上面的例子所示。如果你只输入
如何打印斐波那契数列，你很可能会得到 Python、C++、Java、Ruby 或其他语言的几种解决方案——当你想学习 JavaScript 时，这并没有多大帮助！ -
当你找到一个有用的答案时，把它收藏起来或者复制到某个地方，以便以后再次找到。你会惊讶地发现你多次遇到同样的问题。
-
如果你的代码返回一个特定的错误消息，尝试将该错误输入搜索引擎或 AI 提示。其他人可能过去已经处理过同样的错误，并在某个地方公开记录了解决方案。
-
如果可能的话，坚持使用推荐的网站，如 MDN 和 StackOverflow。
-
在搜索引擎中，你可以使用许多高级搜索技巧，它们会比只输入一个普通搜索词条得到更好的结果。输入一个像
ant fish cheese这样的普通搜索词条会返回包含这些词任何组合的结果。然而，大多数搜索引擎都支持以下语法模式的变体- 输入
"ant fish cheese"（带引号）将只返回包含该确切短语的结果。 ant cheese -fish将返回包含ant和/或cheese但不包含fish的结果。ant OR cheese将只返回包含其中一个词条而不是两个都包含的结果。根据我们的测试，这一个似乎只在 Google 中有效。intitle:cheese将只返回页面主标题中含有“cheese”的结果。
注意： 你可以在各种不同的搜索引擎中使用许多其他技巧。尝试看看你还能找到哪些——一些有用的资源是优化 Google 搜索、如何在 DuckDuckGo 搜索中使用高级语法和Microsoft：高级搜索选项。
- 输入