基於cordova開發的基本事項和常用總結

知識 07-27

1.
基本規範

符合web標準, 語義化html, 結構、表現、行為分離, 兼容性優良. 頁面性能方面, 代碼要求簡潔明了有序, 儘可能的減小伺服器負載, 保證最快的解析速度.

2.
文件規範

html, css, js, image文件均放在約定的目錄中，基本目錄結構如2.1圖，並且目錄與文件名中不能包含中文。其中style放css文件，plugins放平台的cordova插件,index.html為應用的首頁面，icon.png為應用的圖標。（cordova.js和cordova_plugins.js為與平台交互的js文件，必須放在根目錄下）

基於cordova開發的基本事項和常用總結

3.
書寫規範

3.1. html 規範

1. 文檔類型聲明及編碼: 統一聲明為html5，meta屬性讓網頁寬度默認等於屏幕寬度，原始縮放比例為1.0，即100%顯示。編碼統一為utf-8, 書寫時利用IDE實現層次分明的縮進

2. css和js文件外鏈盡量放置在至<head>...</head>之間

3.移動端需要在title上面加上meta,設置width=device-width, initial-scale=1, user-scalable=no 等比例窗口代碼。

例子：

基於cordova開發的基本事項和常用總結

3.2. 引用css和js

由於國網使用的是crodova,為了使各個手機系統使用同一套代碼，所以，在建立移動APPWeb項目的時候，必須先引用cordova.js，而後再引用你的其他js和css。

(友情說明：cordova_plugins.js 不需要引用，需放在跟目錄，再調用cordova.js,會自動去讀取配置，所以大家不必去在意cordova_plugins.js。)

3.3. 常用插件

3.3.1. 登錄插件

基於cordova開發的基本事項和常用總結

3.3.2. 獲取數據插件

基於cordova開發的基本事項和常用總結

3.3.3. 返回與退出應用插件

一般來說，每個應用都有返回至上一頁或者至指定的頁面，也可以直接退出當前應用，而這個js是每個應用都用到的，下面的代碼示例可應用到所有的移動h5頁面中。

代碼示例：

基於cordova開發的基本事項和常用總結

注釋：還有其他各種插件未講解的，請參考移動交互動平台JavaScript介面設計文檔

4.
IOS和安卓常見問題總結

報錯信息	報錯例子	解決方法
andriod可以訪問頁面蘋果訪問不了	Index.html安卓和蘋果都是是寫index.html	蘋果區分大小寫，所以，必須要麼全部小寫，要麼全部大寫，要麼按照定義的格式來抒寫。
訪問不了插件（未獲取到插件方法）	蘋果，安卓都不可以	1：看cordova.js和public.js是否引用2：看plugins文件夾下是否有這個插件3：看引用的路徑是否有錯
安卓可以顯示折線圖，蘋果不顯示	測試時間寫死了。寫成這樣：var t_time = new Date("2015-10-1");安卓可以訪問，蘋果報invalid time	如果是測試的時候，時間格式有5種，嚴格按照時間格式來，才可避免蘋果不顯示數據的問題1）new Date("month dd,yyyy hh:mm:ss"); 2）new Date("month dd,yyyy"); 3）new Date(yyyy,mth,dd,hh,mm,ss); 4）new Date(yyyy,mth,dd); 5）new Date(ms); month:用英文表示月份名稱，從January到December mth:用整數表示月份，從（１月）到１１（１２月） dd:表示一個月中的第幾天，從1到31 yyyy:四位數表示的年份 hh:小時數，從0（午夜）到23（晚11點） mm: 分鐘數，從0到59的整數 ss:秒數，從0到59的整數 ms:毫秒數，為大於等於0的整數 new Date("January 12,2006 22:19:35"); new Date("January 12,2006"); new Date(2006,0,12,22,19,35); new Date(2006,0,12); new Date(1137075575000);或者使用public.js裡面的formatDate()方法。
後台傳的Json字元串，前台使用Json.Parse轉了，安卓是好的，蘋果顯示不了數據(注意：若後台傳的json字元串，前台不識別的情況下)	Json.Parse(v),安卓可進入，蘋果不行	本平台不支持Json.Parse,解決方法：eval("("+v+")") ,最新版本已經支持，如果使用舊版本cordova，請使用eval(雖然eval特么的很浪費內存，但是你也只能使用這個)
蘋果手機彈出未載入插件	把cordova.js和cordova_plugins.js 放在指定的js文件夾中，安卓都可以載入出來，蘋果彈出框（未載入信息）	把cordova.js和cordova_plugins.js 放在根目錄就可以了(注意：這個兩個Js文件，務必放在根目錄下)
蘋果不載入下拉框信息	$("下拉框").attr("selected",true);安卓手機支持，蘋果不支持	寫成$("下拉框").prop("selected",true);