《HTML5移动开发》—— 第1章 学习移动HTML5、CSS3和Java Script API之前的准备工作

简介:

本节书摘来异步社区《HTML5移动开发》一书中的第1章,作者:【美】Estelle Weyl(埃斯特尔 韦尔),更多章节内容可以访问云栖社区“异步社区”公众号查看。

第1章 学习移动HTML5、CSS3和Java Script API之前的准备工作

HTML5移动开发
如果你跟我多少有点类似的话,你肯定已经痛恨旧版IE浏览器很多年了。那些浏览器满是失败。然而,它们在整个生命周期内在任何地方失败的方式是一样的[1]。我们都知道IE6非常糟糕,但是它糟糕的方式是一样的。一旦我们搞清楚了如何填IE6的坑(polyfill[2]),我们就已经把它搞清楚了。

在移动世界,我们同样面临一些问题,不同的是这些问题以一种更新、更多样化且不断变化的方式存在。在不同设备上的不同浏览器版本可能支持很多新的特性,但实现方式可能不同。或者说,它们可能确实支持某个特性,但是这个特性可能并用不了。举个例子,一个现代浏览器可能支持也可能不支持localStorage。支持localStorage的设备可能允许也可能不允许对其写入。即使浏览器允许从localStorage读取数据,但这个读取操作可能非常耗时从而阻碍了性能。并且,即使浏览器通常情况下允许你对其写入,但localStorage本身可能已经达到了存储上限。

我们在这里无法涵盖所有操作系统和设备上所有浏览器的全部非标准情况(quirk)。即使我了解所有的这些非标准情况(而且我也不了解),这些非标准情况可以装满一个大部头,并且在我完成这个大部头之前它就过期了。这本书呢,实际上也过期了。浏览器支持以及规范等周边环境都在不断发生变化。没有办法制作一本最新的书出来,因为到其交付印刷之际——或者甚至在你刚完成一章的时候——周边环境已经变了。虽然某些浏览器、特性、电话以及提到的网站可能已经过时了,但本书带出的最佳实践在未来几年还是有意义的。本书的一个指导原则是:如果你采用最佳实践,并且依照标准编写代码,你的代码将能够在当前及以后所有的设备上运行。

我把针对特性的浏览器支持包含在内了,而且也没有缺少针对浏览器特性的支持,因为所有的浏览器将沿着正确的方向前进正是大家所期望的。今天在浏览器中的那些非标准模式(quirk)明天也许就解决了。

基于以上原因,在使用一个特性时,你不仅确实要做特性检测,而且需要进行测试以确保能够成功地使用这些支持的特性。

本书将使用与设备、操作系统以及浏览器无关的标记并且不使用JavaScript类库。我选择不使用类库仅使用普通JavaScript进行编码以确保你学到真正的代码。通过使用普通JavaScript编码,希望就不会存在一个方法到底属于原生方法还是框架提供的方法这样的困惑了。

但这不意味着你不应该使用类库。恰恰相反!开源类库是弄清楚浏览器不标准情况的最佳选择之一。开源项目拥有成百上千甚至成千上万的贡献者。这些成千上万的贡献者们密切地在大量的设备上进行开发和测试,他们找出那些不标准的情况,报告问题,并且给类库提交修正来处理这些情况或者提供解决方法和腻子脚本。这成千上万双眼睛同时也在报告bug,提醒浏览器厂商注意那些没有遵循标准运行的东西,以便这些bug可以在浏览器后续发布中得以修正。

流行的开源类库和HTML5 JavaScript API腻子脚本是快速发现各种各样的浏览器不标准情况及其解决方案的最佳资源。它们应被视为你的开发工具箱中的一个重要组成部分。即使你不使用它们,也一定要阅读这些源码来学习别人已经发现了的那些移动浏览器的bug。

在你阅读HTML5、CSS3以及相关的JavaScript API时,学习的最佳方法就是编写代码。让我们开始编码吧。

相关文章
|
11月前
|
开发框架 JavaScript 前端开发
精选HTML、JavaScript、ASP代码片段集锦
这些代码片段代表了HTML, JavaScript和ASP的基本应用,可被集成到更复杂的项目中。它们注重实用性,并且易于理解,旨在帮助开发者快速开始项目构建或进行学习。尽管ASP不如其他服务器端技术(如Node.js, PHP, Ruby等)现代,但它在遗留系统中仍非常普遍,了解基础仍具有价值。
377 14
|
存储 前端开发 JavaScript
仿真银行app下载安装, 银行卡虚拟余额制作app,用html+css+js实现逼真娱乐工具
这是一个简单的银行账户模拟器项目,用于学习前端开发基础。用户可进行存款、取款操作,所有数据存储于浏览器内存中
|
人工智能 程序员 UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
901 21
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
SQL JavaScript 安全
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
666 11
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
810 14
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
1249 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
css3 svg制作404页面动画效果HTML源码
css3 svg制作404页面动画效果HTML源码
310 34
html+js+css实现的建筑方块立体数字时钟源码
html+js+css实现的建筑方块立体数字时钟源码
673 33
|
开发框架 Dart Android开发
移动应用开发中的创新之路:探索跨平台解决方案
【9月更文挑战第21天】在移动应用的海洋中,开发者们面临着一个不断变化的挑战——如何在多个操作系统上提供无缝的用户体验。本文将探讨跨平台开发的魅力与挑战,并深入分析Flutter框架如何成为现代开发者的利器。我们将通过实际代码示例,揭示Flutter简化开发流程、提高生产效率的秘密。从Dart语言的基础到热重载的便捷性,本文旨在为读者提供一次全面而深刻的跨平台开发之旅。
|
C# Android开发 虚拟化
C# 一分钟浅谈:MAUI 跨平台移动应用开发
.NET MAUI 是 Microsoft 推出的跨平台框架,支持 Windows、macOS、iOS 和 Android。本文从基础概念入手,探讨 MAUI 的常见问题、易错点及解决方案,并通过代码示例详细说明。涵盖平台特定代码、XAML 语法、数据绑定、性能优化和调试技巧等内容,帮助开发者更好地掌握 .NET MAUI。
1572 55