如何在 iPhone 和 iPad 上查看网页的源代码

尽管 iOS 应用程序还不是开发机器,但您通常会在网页设计师/开发人员的工具包中找到 iPhone 或 iPad。 尽管如果您是开发人员/出版商,或者只是想要查看页面源代码或查看部署在页面上的所有资产的人,您通常是在计算机上进行的。

现在,iOS 8 使查看页面的源代码、资产和 DOM 资源变得更加容易。 多亏了具有扩展支持的出色第三方应用程序,您可以在 Safari 中做到这一点(Chrome 不支持,因为扩展可以访问 判断 仅在 Safari 中)。

让我们来谈谈这两个应用程序,它们可以帮助您在旅途中查看和保存任何网站的源代码。

查看 Safari 的源扩展

查看源代码 ($0.99) 是一个简单而强大的应用程序,带有 Safari 扩展。 它的成本为 0.99 美元,但具有许多功能。

安装应用程序后,转到 Safari,点击“共享”按钮,在底部行向右滑动并点击“更多”。 从这里切换查看源。 这将启用扩展。

有关 iOS 8 扩展的更多信息: iOS 8 扩展正迅速成为一个强大的工具。 看看它们是如何工作的,最好的共享扩展,以及一个扩展如何帮助你将 Safari 变成一个成熟的下载器。

现在,转到该页面,点击“共享”按钮,然后选择“查看源”。 您将看到页面的源代码。 点击“共享”按钮以显示本机共享表。 从这里您可以将代码发送到笔记应用程序或通过电子邮件发送。

图像 2419

您将在下方看到四个按钮——资产、DOM、脚本和信息。

资产列出页面上的所有图像。 您可以点击链接查看预览并保存图像。

DOM 按钮将显示一个树模型,其中包含 HTML、XML 和 SVG 文档的层次结构。 您可以点击任何元素来展开它。

图像 2421

图像 2422

脚本按钮允许您在任何页面(本地)编写和注入 Javascript。 信息面板显示有关页面的信息。

斯卡法里

斯卡法里 ($0.99) 是查看源代码的替代方法。 虽然该应用程序会向您显示源代码和资源,例如图像、CSS 样式表和在页面上运行的脚本,但您必须从应用程序本身执行此操作。 Srcfari 没有 Safari 扩展。

图像 2426

图像 2428

也就是说,使用 Srcfari 一点也不糟糕。 该应用程序具有很好的排版,并且在按脚本、CSS 和图像分解资产方面比查看源应用程序做得更好。 我对 Srcfari 的一个抱怨是它启用了 CSS 样式表的文本换行,但在您查看整个源代码时(查看源应用程序会这样做)。 这意味着至少在 iPhone 上将涉及相当数量的平移和缩放。

图像 2429

图像 2430

除此之外,Srcfari 是平常的事情。 您可以将源代码复制到剪贴板或通过电子邮件发送给某人。 您还可以使用该应用程序保存图像。

结论

Safari 可能已经是您在 iOS 上的首选浏览器(主要是因为 iOS 不允许您选择 Chrome 默认)。 如果您需要经常查看源代码,那么 0.99 美元的 View Source 应用程序及其 Safari 扩展将物有所值。

您通常使用 iPhone 或 iPad 来排除网站故障吗? 或者看看他们有什么问题? 请在下面的评论中告诉我们。