成都网站建设设计

将想法与焦点和您一起共享

关于html5调试的信息

如何在移动设备上调试html5开发的网页

可以使用Chrome浏览器,Chrome浏览器带有移动模式

公司主营业务:网站设计制作、成都网站建设、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。创新互联建站是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联建站推出万宁免费做网站回馈大家。

Chrome打开Html5网页,点击F12打开开发者工具,然后点击下图中的手机图标,重新刷新页面,就可以模拟在移动设备上的样式,可以由不同的移动设备供选择

如何实用便捷的在本地真机调试WEB端HTML5网页

1、如果你能FQ

chrome在32版本后就自带了移动端调度工具,可以在Android直接联调,但唯一遗憾的是,在我大天朝要FQ后才能行的通,我自己试了后公司好几个机器联不上…

2、如果你有苹果电脑和iphone

苹果电脑上的safari 6.0版本后就可以直接连接iphone手机调试手机版上safari正在浏览的web页面,前提是你得有个苹果电脑和iphone手机,但如果你是Android的话,就没办法了

符合前端B格的“小苹果”

自己在公司里也是开发Mobile端的HTML5页面的,也深受调试页面之苦,移动端的WEB页面坑又多,所以用node-webkit技术做了一个客户端,专门用来调试,现在每天工作之前都先打开“小苹果”

小苹果用的是node-webkit技术打包成客户端,其实内部实现都是web 页面与nodejs技术,所以特别符合前端B格。而且由于用了node-webkit技术,客户端可以跑在windows和mac电脑上,齐活儿了

小苹果官方网站

里边有下载及安装和使用的方法

HTML5开发时,为什么要进行浏览器的调试

进行浏览器调试的目的是让网页在各个浏览器当中都能够表现一致,除了能够正常地呈现信息,供用户使用之外,在样式上、行为上都能够与最初“设计构思”的效果相符合。

在开发当中,开发工程师会遇到如下两个问题,这两种问题也是要求开发工程师及时调试的原因。

1、 浏览器对代码的支持程度不同

有些浏览器支持某些命令,而有些不支持,这也就导致网页在部分浏览器当中表现正常,在部分浏览器当中表现不正常。通过浏览器调试,可发现这些问题并及时解决。

2、 开发者自身问题

开发工程师在书写代码时,难免会书写出“错误”或“有问题”的代码。例如,子级元素的大小超出了父级元素的大小,此时,代码在容错性比较高的浏览器(如谷歌Chrome浏览器)当中并不会出现什么问题,但是在容错性比较差点的浏览器(如IE6-IE8)当中就有可能出现页面布局崩溃的现象。

进行代码的调试,就是为了及时发现问题,并且尽快解决问题,为防止书写了很多代码之后,突然发现在某些浏览器中是错乱的,而原因却又无从查起,最后不得不重新书写或花费大量时间在查找错误上。

html5开发的页面怎么在iphone上调适

用iphone调试html5页面的方法如下:

1、打开手机web检查器。

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

2. 连接电脑(Mac)

1)先在手机Safari中打开你想调试的网页,并用数据线连接到电脑

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

3)点击2中的网站名就会在电脑上打开Safari的控制台,如下图(点击查看大图):

此时可以查看手机网页的DOM结构,并且和电脑端网页调试无异,当鼠标滑过这些DOM节点的时候手机上的相应布局也会高亮起来,如下图(点击查看大图):


网站题目:关于html5调试的信息
文章位置:http://chengdu.cdxwcx.cn/article/dsscgdp.html