在移动端轻松查看网页源代码:View Source 2.0
gaoyangw 2024-12-23 09:55 33 浏览 0 评论
如果你是一名站长或 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 元。
相关推荐
- Google Docs加入一批由行业专家设计的新模板
-
GoogleDocs在去年推出的一项重要更新则是引进了实用的模本功能，它可以帮助用户快速启动常见文件类型。现在这家公司打算进一步深化这一功能，日前，谷歌宣布在GoogleDocs中加入一批由行业内...
- Dedecms织梦模板安装教程、模板更换教程汇总
-
模板安装方法：1、下载一个模板之后要判断一下文件是否齐全。Htm文件中是否包含首页、列表页和文章内容页等；htm文件用到的css文件是否包括；模板安装包中是否包括网站用到的背景图片。2、建站网站栏...
- 5分钟学会用Python Jinja2模板引擎渲染HTML网页
-
在深入PythonWeb开发的过程中，HTML模板渲染是构建动态Web应用的重要环节。今天将详细探讨如何使用Python中最流行的模板引擎之一——Jinja2来进行高效且灵活的模板渲染。通过具体的代...
- Discuz!是什么东西怎么搭建?论坛程序安装+模板配置教程
-
Discuz!论坛程序安装+模板配置教程Linux系统安装方法：...
- 如何做小程序页面设计模板?
-
如何制作小程序页面设计模板？微信小程序页面的设计理念、颜色、布局等都要精心安排，但大多数想做小程序的卖家都是新手，不懂设计知识。那么小程序页面设计模板怎么做呢？一、应用优质材料当小程序页面设计模板、旋...
- wordpress营销型外贸公司网站模板:XSwm
-
外贸行业的营销人员互联网思维程度高，大家都知道互联网营销是如今最重要的外贸销售方式。从事外贸行业的营销人员都知道一个好的外贸网站的重要性。很多外贸行业的营销人员也都上过米课的外贸营销课程，看过很多振奋...
- 如何申请成为(WPS)稻壳儿个人设计师，用模板赚钱?
-
前段时间经常看到关于想通过制作模板赚钱的提问，也看到关于稻壳设计师的信息，但是没有看到完整的流程，所以就自己操作了一下申请流程。通晓PPT模板、合同模板、课件设计、简历制作、图标设计、海报设计、版式设...
- wordpress公司展示型通用模板:XShw
-
主题介绍xshw公司模板是一款现代化风格、通用型公司展示的Wordpress公司建站模板，采用经典的颜色搭配、精致的模块布局、完善的列表模板、响应式自适应技术以及配置的大幅全屏轮播图、公司简介、业务介...
- Elementor专题 | 5款超炫酷Elementor模板工具，赶快get起来
-
文|属金鱼的雪梨宝宝...
- DeepSeek如何写网站模板?附带提示词，直接拿去抄!
-
以前写网站，代码是门槛。现在，用上DeepSeek这种AI大模型，连新手都能“一句话整出一个网站模板”！关键是：效率高、能中文对话、不花钱！不会写代码也能做出网页？DeepSeek真能帮你搞定！...
- 一个简单的 HTML 网页设计代码
-
<!DOCTYPEhtml><html><head><title>我的网页</title>...
- 响应式粉色婚礼网站模板源码
-
FOXEWEDDING是一个漂亮的HTML5婚礼网站模板，易于使用的婚礼网页模板建立在Bootstrap框架上。它可以用作婚礼邀请、新人结婚表白。模板是响应式的设计，所以你也可以把它在手机/平板电脑设...
- 迅睿cms模板，迅睿cms模板风格，迅睿cms模板主题(详见图片)
-
迅睿cms模板，在CodeIgniter4框架上增加了基础内容模块管理功能、后台管理体系、插件功能体系、模板引擎、常用扩展类、常用模型类等程序组件，让CI4框架中文化，迅睿cms模板更好的适应于国内的...
- 跨屏建站网kpfree免费网站模板2023.1.14发布更新
-
跨屏建站网kpfree免费网站模板2023.1.14发布更新，摒弃了之前的卡片式设计，采用了移动优先的设计原则，简化了页面设计风格，优化了代码，优化了图片质量，确保网页打开速度。砍掉了一些花哨而无用的...
- 8个顶级React.js免费模板
-
前言您可能知道，React.js是用于构建用户界面的Javascript库。在过去的几年中，UI和UX套件大受欢迎，并且初创公司开始创建许多免费和付费版本的模板，仪表板和套件。React.js由Fac...
欢迎 你 发表评论:
- 一周热门
- 最近发表
- 标签列表
-
- 网站建设 (107)
- 网站开发 (47)
- 网络推广哪个平台好 (47)
- 百度收录 (50)
- 搜索引擎排名优化 (49)
- 关键词优化工具 (51)
- 外贸网站建设 (56)
- seo整站优化吧 (50)
- 广州seo (47)
- 苏州网站建设 (59)
- 百度搜索推广 (61)
- 关键词优化公司 (51)
- 网页制作 (47)
- 广州网站建设 (48)
- 电商网站建设 (49)
- 百度站长平台 (48)
- 网站模板 (51)
- 厦门网站建设 (52)
- 百度快照推广 (51)
- 免费网页在线客服系统 (53)
- 雷神代刷网站推广 (53)
- 手机网站建设 (53)
- 网站维护 (53)
- 网页制作教程 (66)
- 百度收录批量查询工具 (48)