【web前端】移动端控制台插件,手机端页面查看相关页面控制台信息
一般调试手机端页面时,基本是在PC端使用手机模式进行断点或console调试、或查看有用的控制台信息的,但依旧有部分功能无法在PC端调试,经常需要使用alert进行断点,然后在手机端看效果,但是这样并不好。
所以如果说有一种插件,可以在手机端查看控制台相关日志,那可比alert强多了。
最近找到了一款,还挺好用的。
插件名:vconsole
比如我们要调试一个移动端页面

我们在页面中注入一段代码:引入vconsole,并创建一个控制台对象。

<!--//www.wuhairui.cn/build/vconsole.min.js-->
<script type="text/javascript" src="//wap.cmread.com/rbc/t/content/repository/ues/js/s109/vconsole.js"></script>
<script type="text/javascript">
var vConsole=new VConsole();
</script>
(请最好放在head标签内)
下面我们打开页面就能看到一个控制悬浮框:

点击该悬浮框可打开该页面的控制台
可以看到console日志、页面信息、请求列表、页面dom、页面缓存等信息。基本构成控制台信息了。





更多功能请自行研究。
【web前端】移动端控制台插件,手机端页面查看相关页面控制台信息的更多相关文章
- PHP判断客户端是PC web端还是移动手机端方法
PHP判断客户端是PC web端还是移动手机端方法需要实现:判断手机版的内容加上!c550x260.jpg后缀变成缩略图PHP用正则批量替换Img中src内容,用正则表达式获取图片路径实现缩略图功能 ...
- JS前端开发判断是否是手机端并跳转操作(小结)
JS前端开发判断是否是手机端并跳转操作(小结) 这篇文章主要介绍了JS前端开发判断是否是手机端并跳转操作,非常不错,具有参考借鉴价值,需要的朋友可以参考下 常用跳转代码 ? 1 2 3 4 5 6 7 ...
- web前端/移动端H5博客专家博客大全--值得收藏的前端技术大牛博客地址
web前端/移动端H5博客专家博客大全--值得收藏的前端技术大牛博客地址 Huang Jie Blog .Com-前端开发 http://www.huangjieblog.com/?feed=rs ...
- Chrome谷歌浏览器web前端开发好用插件(自己用)备忘
Chrome谷歌浏览器web前端开发好用插件(自己用)备忘 一.总结 英语好一点的话要什么工具就直接去Chrome插件里面找非常方便. 二.测试题-简答题 1.Chrome修改页面字符集是什么? 解答 ...
- web前端--移动端适配总结
转自:https://segmentfault.com/a/1190000011586301 作者:Devinnn meta标签到底做了什么事情 做过移动端适配的小伙伴一定有遇到过这行代码: < ...
- EasyDSS高性能流媒体服务器前端重构(六)- webpack-dev-server 支持手机端访问
很多时候,前端开发的页面,不仅要在PC端测试效果, 还要在手机端测试效果. 在开发阶段, 我们以 webpack-dev-server 来启动浏览器, 打开正在开发的页面. webpack-dev-s ...
- web前端 —— 移动端知识的一些总结
个人在移动端的一些总结归纳,有新的知识点会一直更新 一.css部分 1.meta标签 <meta name="viewport" content="width=de ...
- DT6.0二次最后一次开发插件-手机端熊掌号定时提交
今天写完这个,就是DT6.0最后开放的插件,因为群里的朋友需要,就写了一个适合DT6的手机端定时插件.不过个人还是喜欢7.0的版本,7.0的插件在上几期分享了,今天就不过多说了! 我这个是初成品,改善 ...
- web前端-移动端响应式与自适应
一. 在HTML的头部加入meta标签 在HTML的头部,也就是head标签中增加meta标签,告诉浏览器网页宽度等于设备屏幕宽度,且不进行缩放,代码如下: <meta name="v ...
随机推荐
- element ui table 导出excel表格
https://blog.csdn.net/u010427666/article/details/79208145 vue2.0 + element UI 中 el-table 数据导出Excel1. ...
- (转)Fabric 1.0 读写集
本文译自Fabric 1.0 文档,这篇文档详述了当前读写集语义实现的细节.文档地址为: https://hyperledger-fabric.readthedocs.io/en/latest/rea ...
- 如何使用向量代表文档doc或者句子sentence
1.“句向量”简介word2vec提供了高质量的词向量,并在一些任务中表现良好. 关于word2vec的原理可以参考这几篇论文: https://arxiv.org/pdf/1310.4546.pdf ...
- 【Redis】主从同步
Redis提供了主从复制功能,主要是为了保证服务的高可用性.在redis.conf配置文件中通过设置,可以开启主从复制功能.或者在客户端中使用slaveof 命令开启该功能. slaveof < ...
- Elasticsearch5.x创建索引(Java)
索引创建代码使用官方给的示例代码,我把它在java项目里实现了一遍. 官方示例 1.创建索引 /** * Java创建Index */ public void CreateIndex() { int ...
- 移动开发--移动web特别样式处理
高清图片:100px*200px的图片 设置100px*100px的大小,会被拉大,变模糊,应该用100dp*100dp(物理像素)去渲染. 一像素边框: 相对单位rem: 多行文本溢出.
- Mac下android studio卡,居然这么解决了。。。。
一直修改build.app直接卡死.... 最后把网线拨了,居然不卡了.. 直接设置代理为127.0.0.1直接不卡了,无语了...
- Hibernate框架第二天
### Hibernate的持久化类 ### ---------- **什么是持久化类** 1. 持久化类:就是一个Java类(咱们编写的JavaBean),这个Java类与表建立了映射关系就可以成为 ...
- InstallShield 读注册表函数 RegDBGetKeyValueEx ()执行失败
注: rtn = RegDBGetKeyValueEx(szKey, szNumName, nvType, svNumValue, nvSize); 调用失败如果这个函数的几个参数没有初始化的值,调用 ...
- html5-css的使用强制优先级
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...