多语言展示
当前在线:131今日阅读:113今日分享:31

h5(移动端)页面用什么工具测试?

做移动端h5的页面 ,最烦人的估计是测试部分了,尤其麻烦的是针对微信页面的测试。怎么快速测试移动端页面,快速有效的完成工作任务,就变得非常重要,下面小编简单介绍下各种测试移动端的工具,可以愉快的解决上面的烦人问题。
工具/原料
1

电脑、手机

2

谷歌浏览器、QQ浏览器、微信开发者工具

方法/步骤
1

方法一,最简单粗暴的方法当然是直接拿起手机,输入测试地址或者扫描二维码直接测试移动端页面啦。但这种方法很难发现问题是什么引起的,也没办法直接看当前代码的运行情况。当然如果是内部网络地址还需要找运维开通wifi等网络权限才能查看页面(不可能每次都传到外网去)。

2

方法二,下载QQ浏览器,安装微信调试工具(直接在浏览器右上角点击“三”小按钮,进入应用中心,搜索微信调试工具,在结果中直接点击安装改工具即可),点击右上角带个黑色小工具“微信图标”,鼠标移到网页调试按钮;

3

准备好手机数据线,连接电脑,按照页面调试详细教程(4个步骤)直接操作即可,如图所示;

4

方法三,下载谷歌浏览器,点击浏览器右上角“三”图标,在下拉选项中选择“更多工具”-“开发者工具”,或者直接按F2;

5

在弹出的面板中,选择左上角“手机”图标,浏览器内容即可变成模拟手机模式,如图所示;

6

通过点击模拟手机左上角的图标,还能随意切换iphone手机型号,查看对应型号下页面的展现形式;缺点是不能测试微信的分享部分内容;

7

方法四,下载微信web开发者工具,点击右上角的登录按钮,扫描授权后登录即可测试页面,该工具还可以测试微信的内容分享部分。非常好用,是小编极力推荐的一种方式;

8

各工具各有各的优点和缺点,就看自己的熟悉情况了。

注意事项

小编使用的浏览器都是最新版,可能跟其他版本略有不同。

推荐信息