使用“快捷指令”(Shortcuts) - 最推荐、最方便的方法

这是 iOS 系统自带的功能,无需安装任何 App,操作起来也非常流畅,我们只需要创建一个“快捷指令”即可。

ipad怎么查看网页源代码
(图片来源网络,侵删)

步骤如下:

  1. 打开“快捷指令”App

    • 在 iPad 的主屏幕找到并打开名为 “快捷指令” 的紫色图标(通常自带,如果没有可以去 App Store 下载)。
  2. 创建新的快捷指令

    • 在快捷指令 App 的“快捷指令中心”页面,点击右上角的 号。
    • 点击右上角的 “添加操作” 按钮。
  3. 添加“获取网页源代码”操作

    ipad怎么查看网页源代码
    (图片来源网络,侵删)
    • 在搜索框中输入 “获取网页源代码”
    • 从列表中选择 “获取网页源代码” 这个操作(它属于“脚本”类别)。
  4. 添加“显示结果”操作

    • 再次点击 “添加操作”
    • 搜索 “显示结果”“显示”
    • 选择 “显示结果” 这个操作(它属于“脚本”类别)。
  5. 连接两个操作

    • 你会看到“获取网页源代码”和“显示结果”两个方框。
    • “获取网页源代码” 方框右侧拖出的圆点,连接到 “显示结果” 方框左侧的圆点,这样,当“获取网页源代码”完成后,会自动将结果传递给“显示结果”。
  6. 保存快捷指令

    • 点击右上角的 “完成”
    • 给这个快捷指令起一个你喜欢的名字,“查看源码”,然后点击 “完成”

如何使用:

ipad怎么查看网页源代码
(图片来源网络,侵删)
  1. 在 Safari 或其他浏览器中打开你想要查看源码的网页。
  2. 点击 分享按钮(一个向上箭头组成的方块)。
  3. 在分享菜单中,找到并点击你刚刚创建的 “查看源码” 快捷指令。
  4. 稍等片刻,网页的源代码就会以纯文本的形式显示出来,你可以进行复制、搜索等操作。

使用第三方浏览器 App

一些第三方浏览器内置了查看源码的功能,操作非常直观。

以 Safari 浏览器为例(系统自带):

Safari 本身没有直接查看源码的按钮,但可以通过一个变通的方法实现。

  1. 在 Safari 中打开目标网页。
  2. 点击 分享按钮
  3. 向下滑动,找到并点击 “用‘代码编辑器’打开” (Open in Code Editor)。
    • 注意:如果你的 iPad 上没有安装任何可以编辑代码的 App(如 Pythonista、Textastic 等),这个选项可能不会出现。
  4. 如果你有安装这类 App,它会用该 App 打开当前网页的 HTML 源代码。

以 Chrome 浏览器为例:

  1. 在 Chrome 中打开目标网页。
  2. 点击地址栏左侧的 锁形图标“i” 信息图标。
  3. 在弹出的信息面板中,向下滚动,找到 (Connection is secure) 这一项,点击它。
  4. 在新的页面中,点击 “查看源代码” (View source) 或类似的选项,即可在新标签页中看到源码。

使用专业的代码编辑器 App

如果你经常需要查看或编辑代码,可以安装一些功能强大的代码编辑器 App,这些 App 通常都支持从浏览器或本地导入文件来查看源码。

推荐 App:

  • Textastic:功能非常强大,支持多种语言,可以通过 WebDAV、FTP、SFTP 等方式连接服务器,也可以直接从 Safari 打开网页源码。
  • Pythonista:一个功能强大的 Python 开发环境,也可以用来查看和编辑文本文件,包括 HTML。
  • a-Shell:一个基于命令行的工具,可以通过一些命令来获取网页源码(例如使用 curl 命令)。

以 Textastic 为例:

  1. 在 App Store 下载并安装 Textastic。
  2. 在 Safari 中打开目标网页。
  3. 点击 分享按钮
  4. 在分享菜单中找到并点击 “在 Textastic 中打开” (Open in Textastic)。
  5. Textastic 会立即解析并显示该网页的 HTML 源代码。

使用“审查元素”功能(进阶,仅限 Safari)

这个方法可以让你像在电脑上使用 Chrome 开发者工具一样,实时地检查和修改网页元素,但它主要针对 Safari 浏览器

步骤:

  1. 开启“网页检查器”

    • 进入 iPad 的“设置” App。
    • 向下滑动,找到并点击 “Safari 浏览器”
    • 向下滑动,找到 “高级” 选项,打开它。
    • 开启 “网页检查器” 的开关。
  2. 使用网页检查器

    • Safari 浏览器中打开你想要检查的网页。
    • 点击地址栏左侧的 “aA” 图标。
    • 在弹出的菜单中,选择 “网页检查器”
    • 屏幕会一分为二,下方会出现一个类似开发者工具的界面,你可以在这里查看和修改 HTML、CSS,执行 JavaScript 等。
方法 优点 缺点 适合人群
快捷指令 无需安装 App、免费、系统原生体验、一次设置永久使用 需要手动创建一次快捷指令 所有普通用户,最推荐
第三方浏览器 操作直观,集成在浏览器内 依赖特定浏览器,不一定所有浏览器都有 Chrome 用户或习惯用特定浏览器的用户
代码编辑器 App 功能强大,可编辑、高亮、连接服务器 需要额外安装 App,可能收费 开发者、经常需要处理代码的用户
网页检查器 功能最强大,可实时调试和修改 仅限 Safari,操作相对复杂,主要用于开发 网页开发者、需要深度调试的用户

对于绝大多数 iPad 方法一(使用快捷指令)是最佳选择,因为它免费、便捷,且一劳永逸。