在移动端轻松查看网页源代码:View Source 2.0

yumo6664个月前 (04-22)技术文章34

如果你是一名站长或 Web 开发者,在浏览器中查看网页源代码(HTML、CSS 与 JavaScript)是每天必不可少的操作,这个在桌面端轻而易举的操作到了移动端却变成了一件麻烦事。如今有了 View Source 对 iOS 8 Extensions 的巧妙利用,在移动端对网页源代码进行浏览与操作将变得很轻松。

安装 View Source 后,通过 Safari 分享按钮打开 View Source 开关,这样就可以显示当前网页源代码,如果你不想这么做,也可以把 View Source 作为一个独立应用去打开想要查看的网站源码,当然,在这种情况下,View Source 不会显示网页内容,而是直接显示页面源代码。

这里可以看见关于少数派网页的源代码,例如通常的 SEO 人员会去为网页定义 Title 以及 Meta 标签的 Keywords,以保持搜索引擎对于网站更好的抓取。

View Source 中通过 DOM 节点树可以很直观的看到当前网页的结构,用来查找和访问节点变得很容易。另外很酷的一点是 View Source 还可以通过 inject JS 来编写自定义 JS 代码,退出插件时会在 Web 页面显示输出的 JS 效果。例如在少数派页面下 Script 中输入:

alert(document.title);

退出插件就可以在 Safari 中显示关于少数派网站 Title 标签的 alert 弹窗,效果如图。

当然,如果你想在弹窗中显示一句话的话,可以在 Script 中输入:

alert(I love Sspai);

当然,这些只是普通的 JavaScript alert 代码,如果你有更有趣的玩法或者更实用的功能,也可以在评论中告诉我。

通过右上角更多的选项可以调用更多的功能,例如将代码复制至剪切板在其他应用上继续编辑,也可以发送邮件、选择高亮与更多主题,这里不妨多说一下,View Source 提供了很多高亮的主题以供选择,笔者个人比较倾向于 Blue Screen 这个主题。

View Source 目前可以从 App Store 下载,售价 6 元。

相关文章

亚马逊大卖都在用的那些链接 -- 权威链接

最近不少人在问类似几个问题:“测评时,关键词找不到自己?站外投放什么链接?”所以小编今天好好的说说你可能知道的或者不知道的那些链接:原始链接、重中之重的权威链接、神乎其神的超链接、后来居上的二次链接等...

个人网站集成js小游戏《圈小猫》教程及源码

今天在某网站浏览帖子的时候,发现帖子被删除了,然后弹出了404页面,页面上集成了一个小游戏,小游戏长什么样子呢?看下面这个图!第一步查看小游戏源码,发现这个小游戏完全是由JavaScript编写的,因...

如何查看网页的HTML源代码?这里提供详细步骤

每个主要的互联网浏览器都允许用户查看任何网页的HTML(超文本标记语言)源代码。以下部分包含有关在每个主要浏览器中查看源代码的多种方法的信息。引言查看网页的源代码时,服务器处理的信息和代码不会出现。例...

网站链接地址抓取助手

想要轻松获取网站的内链,那就赶紧来使用网页链接提取工具,软件是一款功能强大实用的网站内链获取软件,功能给出强大的网站内链获取工具,使用后即可网站内链全部获取,大大提高了工作效率,并且操作简单,使用方便...

软网推荐:滚动截图将超长网页“一网打尽”

网页截图是我们最常使用的一个功能,但是一般网页都会超过一屏的页面。所以按照常规的方法进行截屏操作的话,就不能将所有的内容进行截取操作,往往需要进行几次截屏并进行拼接才可以。其实借助一些软件工具,无需如...