必赢亚洲手机app下载


啊!CEO!366net必赢亚洲手机版主任!【2】

简单易行生活

怎么着在移动装备上调节html5支出的网页

 

在大家用phoengap+html5做的移动app中,常常蒙受的标题就是本地网页包容不过到了app出现不般配的情形,原因是手提式有线电话机端页面,大多运维在webkit内核的浏览器上,但依然会因阳台、厂商的区别而有种种包容性难点。

 

下边就介绍一下在iOS和Android三个阳台上怎么着在真机上对页面进行调节。那里要表达的是,iOS平台只好用自带的Safari浏览器来调节,而Android平台也只能用google
Chrome浏览器来调节。当然,笔者眼下只发现那样三种手段,假若您还有别的格局可调剂更加多的浏览器,希望您能留言告知我。

一、iOS + Safari

① 、打开手提式有线电电话机web检查器。

经过【设置】>【Safari】>【高级】>【Web检查器】打开。见下图(点击查看大图),并且你会合到该选项上边对电脑操作的相应描述,照做就好。

366net必赢亚洲手机版 1

366net必赢亚洲手机版,2.链接电脑(Mac)

2.1
先在三弟徐熙媛女士afari中开拓你想调节和测试的网页,并用数据线连接到电脑(小编那边是Mac)

2.2
再在电脑上开拓Safari点击【Develop】菜单,就会看到如下图所示(点击查阅大图):

366net必赢亚洲手机版 2

3.3
点击2.第22中学的网站名就会在微型总括机上开拓Safari的控制台,如下图(点击查看大图):

366net必赢亚洲手机版 3

 

3.调节网页

如上3.3图所示,此时你能够查阅手提式有线话机网页的DOM结构,并且和电脑端网页调节和测试无差别,当鼠标滑过那些DOM节点的时候手机上的对应布局也会高亮起来,如下图(点击查看大图):

366net必赢亚洲手机版 4

 

二、Android + Chrome

1.设置手提式有线电话机

 

1.1【设置】>【关于手提式无线电话机】>【版本号(Build
number)】,对版本号这一项连点7下(这是合法文书档案里的布道)就会唤起“你已化作开发者”。

366net必赢亚洲手机版 5

 

1.2 再重临【设置】>【开发者选项】>【USB调节和测试】打开手提式有线电话机USB调节和测试。

366net必赢亚洲手机版 6

 

2.安装电脑(Mac)

那块相比麻烦,因为要装一下Android的SDK。

2.1 下载Android
SDK
,并解压,作者把全体adt目录放在了 /Users/大卫/adt/
那里。

2.2 设置环境变量 。打开终端在大卫路径下(形如 大卫deMacBook-Pro:~
David$)输入 open
.bash_profile,若是文件存在则会打开,如若不设有则再输入touch
.bash_profile 创造并开拓这么些文件。在文书里输入export
PATH=$PATH:/Users/大卫/adt/sdk/platform-tools:/Users/大卫/adt/sdk/tools ,关闭保存。最终在终极里输入 source
.bash_profile 来更新环境变量使其收效。终端里输入 adb 出现命令补助消息正是成功了。

2.3 在终点里输入 adb forward tcp:9222
localabstract:chrome_devtools_remote  。

 

3.链接电脑

3.1
在手提式有线话机上的Chrome里打开想要调节和测试的网页,用数据线连接手提式有线电话机和计算机(作者的是Mac。唉~笔者只是强调平台的例外,不要误会)。

3.2 打开电脑上的Chrome,在地址栏里输入 about:inspect入选 【Discover
USB Devices】前面包车型客车复选框。出现下图画面(点击查看大图):

366net必赢亚洲手机版 7

 

4.调剂网页

4.1
你能够点击图3.2中检查和测试到的装备上正在运作的网站上边这一个【inspect】,或然在浏览器中输入
localhost:9222 打开手提式有线电话机正在浏览的网页列表,如下图:

366net必赢亚洲手机版 8

 

4.2
点击上海教室中的网站缩略图,就会跳转到谷歌的三个代理链接(链接只怕被墙……,挂代理)就会打开如下图所示的控制台(点击查阅大图):

366net必赢亚洲手机版 9

 

4.3
那就和总计机上网页调节和测试没什么差异了,鼠标经过DOM节点,手提式有线电话机上的布局同样也会高亮起来:

366net必赢亚洲手机版 10

嗯嗯嗯,over

相关文章

No Comments, Be The First!
近期评论
    功能
    网站地图xml地图