利用chorme调试手机网页

太方便了,很实用的技巧(特意记录一下)

1.pc端安装最新的chrome

2.手机端安装最新的chrome ( Android机 )

3.USB连接线

4.打开电脑的chrome 在地址栏输入 chrome://inspect 选中 Discover USB devices 可以检测到你的设备 可以看到监测到我的设备是C6603 #YT9108PMBJ

5.打开手机上的chrome,访问你需要调试的网站;这时pc上的chorme会出现你访问的网址的记录,如下图

6、点击上图访问链接下面的inspect,这个时候会打开一个新的窗口,如下图;你在此窗口上就能像以前调试桌面站点一样的调试手机站点了。

时间: 2024-10-05 03:06:49

利用chorme调试手机网页的相关文章

使用weinre远程调试手机网页(nodejs、phoneGap)

本调试方式需要wifi环境和webkit浏览器. weiner主页:http://people.apache.org/~pmuellr/weinre/docs/latest/Home.html 一.配置调试服务器 (一).nodejs搭建调试服务器(以windows为例)1.安装node.js安装程序下载:http://nodejs.org/#download本文安装在“F:/nodejs/”目录. 2.测试安装是否成功打开CMD,切换到nodejs所在的安装目录.输入如下命令测试node.js

使用weinre通过PC浏览器调试手机网页

Weinre是什么? Weinre代表Web Inspector Remote,是一种远程调试工具.举个例子,在电脑上可以即时的更改手机上对应网页的页面元素.样式表, 或是查看Javascript变量,同时还可以看到手机上页面的错误和警告信息. Weinre作为一种远程调试工具,在结构上分为三层: 目标页面(target):被调试的页面,页面已嵌入weinre的远程js,下文会介绍: Debug客户端(client):本地的Web Inspector调试客户端: Debug服务端(agent):

Eruda——手机网页前端调试面板

在日常的移动端开发时,一般都是试用chrome浏览器的移动端模式进行开发和调试,只有在chrome调试完成,没有问题了才会上到真机测试,移动端开发的一大问题就在于此, 各种品牌各种型号手机,手机中各种类型的浏览器APP........还好移动端的相对一致点,但是往往都会有一些各种各样的坑,这时候就蛋疼了,明明chrome调试工具中是正常的, 一到某个浏览器中就炸了,怎么办,又无法像在chrome中使用调试工具进行调试,只能通过alert()弹窗来调试,有什么办法可以像PC上那样清晰,可视化的调试

手机网页调试利器: Chrome

新开发的网页需要在手机或是模拟机上运行测试, 可以借助 Chrome提供的手机网页预览程序进行简单调试.查看 制作的网页是否能够适合各种手机型号使用. 下面所以下如何使用Chrome调试多类型手机网页. 首先 下载Chrome 浏览器. 在你要调试的网页或是本地页面中.按F12 打开调试器.(即开发者模式) //==============================================

调试手机上网页 (断点 console timeline 选择dom)

用手机看网页,越来越多,手机app套个webview的也很多,那该如何调试手机上的页面了?比如 断点,选dom,console,控制台输出,查看内存,== 嗯,万能的的chrome和safari还是帮我们解决了这些事情 android下调试手机上的网页(断点,查看修改dom,console输出,timeline,===) ios下调试手机上的网页 遇到的一些问题 android下调试手机上的网页(断点,查看修改dom,console输出,timeline,===) 一些说明 这个方案是chrom

电脑连接并调试手机浏览器的网页

直接在浏览器上 用浏览器的手机模式 模拟手机环境有时候不是太准确,所以想办法 实现在手机上能连接,并调试手机正在访问的网页,文本给出了解决方法(没有苹果手机,所以只做了安卓的) 下图就是电脑上连接好的效果: 需要做一下步骤 一, 手机端的准备: 1.usb数据线,第一次连接电脑跟手机 可能还需要装驱动: 2.打开开发者模式,打开选择USB配置,设置成USB连接(一定注意),具体手机连接可以不太一样 ,但是都需要设置成usb连接方式 3,下载手机版谷歌浏览器,调试的时候 用的是谷歌浏览器 二,电脑

支付宝手机网页即时到账接口(5)之交易接口页面跳转同步通知

前言 这篇文章主要讲诉系统调用支付宝手机网页即时交易接口后支付宝返回的同步通知. 支付宝对商户的请求数据处理完成后,会将处理的结果数据通过系统程序控制客户端页面自动跳转的方式通知给商户网站.这些处理结果数据就是页面跳转同步通知参数.支付宝以GET方式访问商户网站(参数call_back_url,在"手机网页即时到账授权接口(alipay.wap.trade.create.direct)"中指定). html同步返回特性 支付宝处理完请求的数据后,当前界面会自动刷新,立刻显示处理结果:

通过chrome浏览器调试手机页面(IOS和Android)

开发PC页面的时候使用chrome浏览器的开发者工具,可以很容易的捕获到页面的dom元素,并且可以修改样式,方便调试,但是手机上却很麻烦,因为手机上没有办法直接打开开发者工具查看元素.其实可以通过将设备连接到PC,使用PC的开发者工具检测 一.针对android设备 1.在android设备上开始开发者模式 2.将设备连接到PC,在chrome浏览器地址栏输入:chrome://inspect/#devices 3.在手机上打开网页的时候,chrome就会检测到网页,可以直接调试 二.针对IOS

Chrome调试手机页面

新开发的网页需要在手机或是模拟机上运行测试,如果手头事件比加紧,那么可以借助 Chrome提供的手机网页预览程序进行简单调试.查看 制作的网页是否能够适合各种手机型号使用. 下面所以下如何使用Chrome调试多类型手机网页. 首先 下载Chrome 浏览器. 在你要调试的网页或是本地页面中.按F12 打开调试器. 工具/原料 Chrome浏览器 方法/步骤 打开 仿真面板.如图所示: 可以在 Device 选择设备. 可以在Screen  设置模拟的屏幕方面的东西,设置分辨率,屏幕尺寸. 可以在