如题所述
在移动设备上调试html5开发的网页的方法(以苹果开发者为例来说明):
1、手机端设置:
打开设置 → Safari → 高级 → Web 检查器 → 开。
2、mac端打开调试:Safari → 偏好设置 → 高级 → 在菜单栏中显示“开发”菜单。
3、在 OS X 中启动 Safari 之后,以 USB 电缆正常接入 iOS 设备,并在此移动设备上启动 Safari。此时点击计算机上的 Safari 菜单中的“开发”,可以看到有 iOS 设备的名称显示,其子菜单项即为移动设备上 Safari 的所有标签页,点击任意一个开始调试。
此法优点:便捷,简单,高端大气上档次,可以调试外壳包裹的浏览器如微信。
缺点:只局限于苹果开发者。
温馨提示:答案为网友推荐,仅供参考
第1个回答 2016-07-11
一、iOS + Safari
1、打开手机web检查器。
通过【设置】>【Safari】>【高级】>【Web检查器】打开。见下图(点击查看大图),并且你会看到该选项下面对电脑操作的相应描述,照做就好。
2.链接电脑(Mac)
2.1 先在手机Safari中打开你想调试的网页,并用数据线连接到电脑(我这里是Mac)
2.2 再在电脑上打开Safari点击【Develop】菜单,就会看到如下图所示(点击查看大图):
3.3 点击2.2中的网站名就会在电脑上打开Safari的控制台,如下图(点击查看大图):
3.调试网页
如上3.3图所示,此时你可以查看手机网页的DOM结构,并且和电脑端网页调试无异,当鼠标滑过这些DOM节点的时候手机上的相应布局也会高亮起来,如下图(点击查看大图):
二、Android + Chrome
1.设置手机
1.1【设置】>【关于手机】>【版本号(Build number)】,对版本号这一项连点7下(这是官方文档里的说法)就会提示“你已成为开发者”。
1.2 再返回【设置】>【开发者选项】>【USB调试】打开手机USB调试。
2.设置电脑(Mac)
这块比较麻烦,因为要装一下Android的SDK。
2.1 下载Android SDK,并解压,我把整个adt目录放在了 /Users/David/adt/ 这里。
2.2 设置环境变量 。打开终端在David路径下(形如 DaviddeMacBook-Pro:~ David$)输入 open .bash_profile,如果文件存在则会打开,如果不存在则再输入touch .bash_profile 创建并打开这个文件。在文件里输入export PATH=$PATH:/Users/David/adt/sdk/platform-tools:/Users/David/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】前面的复选框。出现下图画面(点击查看大图):
4.调试网页
4.1 你可以点击图3.2中检测到的设备上正在运行的网站下面那个【inspect】,或者在浏览器中输入 localhost:9222 打开手机正在浏览的网页列表,如下图:
4.2 点击上图中的网站缩略图,就会跳转到Google的一个代理链接(链接可能被墙……,挂代理)就会打开如下图所示的控制台(点击查看大图):
4.3 这就和电脑上网页调试没什么差别了,鼠标经过DOM节点,手机上的布局同样也会高亮起来:本回答被提问者采纳
1、打开手机web检查器。
通过【设置】>【Safari】>【高级】>【Web检查器】打开。见下图(点击查看大图),并且你会看到该选项下面对电脑操作的相应描述,照做就好。
2.链接电脑(Mac)
2.1 先在手机Safari中打开你想调试的网页,并用数据线连接到电脑(我这里是Mac)
2.2 再在电脑上打开Safari点击【Develop】菜单,就会看到如下图所示(点击查看大图):
3.3 点击2.2中的网站名就会在电脑上打开Safari的控制台,如下图(点击查看大图):
3.调试网页
如上3.3图所示,此时你可以查看手机网页的DOM结构,并且和电脑端网页调试无异,当鼠标滑过这些DOM节点的时候手机上的相应布局也会高亮起来,如下图(点击查看大图):
二、Android + Chrome
1.设置手机
1.1【设置】>【关于手机】>【版本号(Build number)】,对版本号这一项连点7下(这是官方文档里的说法)就会提示“你已成为开发者”。
1.2 再返回【设置】>【开发者选项】>【USB调试】打开手机USB调试。
2.设置电脑(Mac)
这块比较麻烦,因为要装一下Android的SDK。
2.1 下载Android SDK,并解压,我把整个adt目录放在了 /Users/David/adt/ 这里。
2.2 设置环境变量 。打开终端在David路径下(形如 DaviddeMacBook-Pro:~ David$)输入 open .bash_profile,如果文件存在则会打开,如果不存在则再输入touch .bash_profile 创建并打开这个文件。在文件里输入export PATH=$PATH:/Users/David/adt/sdk/platform-tools:/Users/David/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】前面的复选框。出现下图画面(点击查看大图):
4.调试网页
4.1 你可以点击图3.2中检测到的设备上正在运行的网站下面那个【inspect】,或者在浏览器中输入 localhost:9222 打开手机正在浏览的网页列表,如下图:
4.2 点击上图中的网站缩略图,就会跳转到Google的一个代理链接(链接可能被墙……,挂代理)就会打开如下图所示的控制台(点击查看大图):
4.3 这就和电脑上网页调试没什么差别了,鼠标经过DOM节点,手机上的布局同样也会高亮起来:本回答被提问者采纳
第2个回答 2016-07-11
方法如下:
1、进入Eclipse,导入一个项目工程,如果项目文件的编码与工具编码不一致 将会造成乱码。如:
2、如果要使插件开发应用能有更好的国际化支持,能够最大程度的支持中文输出,则最好使 Java文件使用UTF-8编码。
修改默认编码
在菜单导航栏上Window-->Preferences 打开"首选项"对话框,左侧导航树,导航到 General-->Workspace
3、Windows 7平台默认为GBK,简体中文操作系统Windows XP、Windows 2000简体中文的缺省编码是GB18030,Linux平台默认为UTF-8
那么在此工作空间中建立的工程编码是GBK,工程中建立的java文件也是GBK。
可以看到默认的是GBK编码格式,我们修改为UTF-8编码格式或者是需要的编码格式
点击Apply,点击OK.
1、进入Eclipse,导入一个项目工程,如果项目文件的编码与工具编码不一致 将会造成乱码。如:
2、如果要使插件开发应用能有更好的国际化支持,能够最大程度的支持中文输出,则最好使 Java文件使用UTF-8编码。
修改默认编码
在菜单导航栏上Window-->Preferences 打开"首选项"对话框,左侧导航树,导航到 General-->Workspace
3、Windows 7平台默认为GBK,简体中文操作系统Windows XP、Windows 2000简体中文的缺省编码是GB18030,Linux平台默认为UTF-8
那么在此工作空间中建立的工程编码是GBK,工程中建立的java文件也是GBK。
可以看到默认的是GBK编码格式,我们修改为UTF-8编码格式或者是需要的编码格式
点击Apply,点击OK.
第3个回答 2016-07-11
一、iOS + Safari
1、打开手机web检查器。
通过【设置】>【Safari】>【高级】>【Web检查器】打开。见下图(点击查看大图),并且你会看到该选项下面对电脑操作的相应描述,照做就好。
2.链接电脑(Mac)
2.1 先在手机Safari中打开你想调试的网页,并用数据线连接到电脑(我这里是Mac)
2.2 再在电脑上打开Safari点击【Develop】菜单,就会看到如下图所示(点击查看大图):
3.3 点击2.2中的网站名就会在电脑上打开Safari的控制台,如下图(点击查看大图):
3.调试网页
如上3.3图所示,此时你可以查看手机网页的DOM结构,并且和电脑端网页调试无异,当鼠标滑过这些DOM节点的时候手机上的相应布局也会高亮起来,如下图(点击查看大图):
二、Android + Chrome
1.设置手机
1.1【设置】>【关于手机】>【版本号(Build number)】,对版本号这一项连点7下(这是官方文档里的说法)就会提示“你已成为开发者”。
1.2 再返回【设置】>【开发者选项】>【USB调试】打开手机USB调试。
2.设置电脑(Mac)
这块比较麻烦,因为要装一下Android的SDK。
2.1 下载Android SDK,并解压,我把整个adt目录放在了 /Users/David/adt/ 这里。
2.2 设置环境变量 。打开终端在David路径下(形如 DaviddeMacBook-Pro:~ David$)输入 open .bash_profile,如果文件存在则会打开,如果不存在则再输入touch .bash_profile 创建并打开这个文件。在文件里输入export PATH=$PATH:/Users/David/adt/sdk/platform-tools:/Users/David/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】前面的复选框。出现下图画面(点击查看大图):
4.调试网页
4.1 你可以点击图3.2中检测到的设备上正在运行的网站下面那个【inspect】,或者在浏览器中输入 localhost:9222 打开手机正在浏览的网页列表,如下图:
4.2 点击上图中的网站缩略图,就会跳转到Google的一个代理链接(链接可能被墙……,挂代理)就会打开如下图所示的控制台(点击查看大图):
4.3 这就和电脑上网页调试没什么差别了,鼠标经过DOM节点,手机上的布局同样也会高亮起来:
1、打开手机web检查器。
通过【设置】>【Safari】>【高级】>【Web检查器】打开。见下图(点击查看大图),并且你会看到该选项下面对电脑操作的相应描述,照做就好。
2.链接电脑(Mac)
2.1 先在手机Safari中打开你想调试的网页,并用数据线连接到电脑(我这里是Mac)
2.2 再在电脑上打开Safari点击【Develop】菜单,就会看到如下图所示(点击查看大图):
3.3 点击2.2中的网站名就会在电脑上打开Safari的控制台,如下图(点击查看大图):
3.调试网页
如上3.3图所示,此时你可以查看手机网页的DOM结构,并且和电脑端网页调试无异,当鼠标滑过这些DOM节点的时候手机上的相应布局也会高亮起来,如下图(点击查看大图):
二、Android + Chrome
1.设置手机
1.1【设置】>【关于手机】>【版本号(Build number)】,对版本号这一项连点7下(这是官方文档里的说法)就会提示“你已成为开发者”。
1.2 再返回【设置】>【开发者选项】>【USB调试】打开手机USB调试。
2.设置电脑(Mac)
这块比较麻烦,因为要装一下Android的SDK。
2.1 下载Android SDK,并解压,我把整个adt目录放在了 /Users/David/adt/ 这里。
2.2 设置环境变量 。打开终端在David路径下(形如 DaviddeMacBook-Pro:~ David$)输入 open .bash_profile,如果文件存在则会打开,如果不存在则再输入touch .bash_profile 创建并打开这个文件。在文件里输入export PATH=$PATH:/Users/David/adt/sdk/platform-tools:/Users/David/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】前面的复选框。出现下图画面(点击查看大图):
4.调试网页
4.1 你可以点击图3.2中检测到的设备上正在运行的网站下面那个【inspect】,或者在浏览器中输入 localhost:9222 打开手机正在浏览的网页列表,如下图:
4.2 点击上图中的网站缩略图,就会跳转到Google的一个代理链接(链接可能被墙……,挂代理)就会打开如下图所示的控制台(点击查看大图):
4.3 这就和电脑上网页调试没什么差别了,鼠标经过DOM节点,手机上的布局同样也会高亮起来: