㈠ App和h5的小知識
當app需要h5頁面的時候，作為前端開發的我們不管是用原聲js還是使用框架Vue、React，我們都只是給app提供一個頁面而已。
一、當app只需要h5做展示的時候，我們就是寫一個頁面給他們就行了，非常容易。（注意做好兼容）
二、當app需要捕獲h5獲取的數據的時候，也很容易
例如：支付頁面是h5
支付方式有三種：1、微信 ；2、支付寶；3:分期付款；
微信、支付寶需要調取原聲app，分期是h5操作；
這個時候我們就在確認支付的以後在window上綁上payType就行了，app可以獲取window；
三、當h5需要app數據的時候，最簡單的方式就是app通過webView把h5需要的數據埋在cookie中；
但h5獲取數據的時候直接在cookie中取就行了
export function getCookie(name) {
const reg = new RegExp(`(^| )${name}=([^;]*)(;|$)`);
const arr = document.cookie.match(reg);
if (arr) {
return arr[2];
}
return null;
}
當iOS和Android方式不同意的時候我們需要判斷系統；
const u = navigator.userAgent;
app = navigator.appVersion;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android終端或者uc瀏覽器
const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios終端
根據不同的系統各自處理；
㈡ web前端與H5前端有什麼區別
一、指代不同
1、h5：是Web中核心語言HTML的規范，用戶使用任何手段進行網頁瀏覽時看到的內容原本都是HTML格式的，在瀏覽器中通過一些技術處理將其轉換成為了可識別的信息。
2、web前端：是創建Web頁面或app等前端界面呈現給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術、框架、解決方案，來實現互聯網產品的用戶界面交互。
二、發展不同
1、h5：結合了 HTML4.01 的相關標准並革新，符合現代網路發展要求，在 2008 年正式發布。
2、web前端：從網頁製作演變而來，在互聯網的演化進程中，網頁製作是Web1.0時代的產物，早期網站主要內容都是靜態，以圖片和文字為主，用戶使用網站的行為也以瀏覽為主。隨著互聯網技術的發展和HTML5、CSS3的應用，現代網頁更加美觀，交互效果顯著，功能更加強大。
三、技術構成不同
1、h5：由不同的技術構成，其在互聯網中得到了非常廣泛的應用，提供更多增強網路應用的標准機。
2、web前端：掌握HTML是網頁的核心，是一種製作萬維網頁面的標准語言，是萬維網瀏覽器使用的一種語言，它消除了不同計算機之間信息交流的障礙
㈢ h5做app和原生app有什麼區別
原生app和h5做的app的區別：
1、開發方面的區別
目前React Native開發越來越火，微信小程序是基於React Native開發的，體驗接近原生APP，發展前景值得重視。不過好在現在非原生APP同樣可以調用藍牙、相機等硬體，也能順利發布到蘋果APP store。
移動Web App
1、因為運行在移動設備的瀏覽器上，所以只需要一個開發項目
2、這種應用可以使用HTML5,CSS3以及JavaScript以及伺服器端語言來完成(PHP,Ruby on Rails,Python)
3、這里可沒有標準的SDK，基本任意選擇別忘了有一些跨平台的開發工具，比如PhoneGap, Sencha Touch 2以及Appcelerator Titanium等等。
原生App
1、每一種移動操作系統都需要獨立的開發項目
2、每種平台都需要獨立的開發語言。Java(Android), Objective-C(iOS)以及Visual C++(Windows phone)等等
3、需要使用各自的軟體開發包，開發工具以及各自的控制項
2、能力方面的區別
移動Web App
只能使用有限的移動硬體設備功能。
原生App
能夠與移動硬體設備的底層功能，比如個人信息，攝像頭以及重力加速器等等。對於這一點感觸很深刻，2016年做新年H5營銷小活動的時候，就是因為沒有考慮到H5不能使用移動硬體端重力加速器而導致臨時替換設計方案。
3、獲取方法的區別
移動Web App
1、從移動設備上的瀏覽器訪問
2、不需要安裝額外的軟體
3、軟體更新只需要伺服器就夠了
4、因為現在沒有什麼商品或賣場提供這種App，不過一般都是嵌套在系統內部，或者內部系 統中使用
5、跨平台開發，用戶不需要去賣場來下載安裝App
6、需要過度依賴網路，沒有任何緩存數據
7、任何時候都可以發布App，因為根本不需要官方賣場的審核
8、如果你已經有了一個Web App，你可以使用 responsive web design來輔助改進
9、所有的用戶都是用同樣的版本
原生App
1、直接下載到設備
2、以獨立的應用程序運行(並不需要瀏覽器)
3、用戶必須手動去下載並安裝這些原生App
4、有一些商店與賣場來幫助用戶尋找你的App，app store裡面應有盡有。
5、原生型APP應用的安裝包相對較大，包含UI元素、數據內容、邏輯框架;
6、手機用戶無法上網也可訪問APP應用中以前下載的數據。
7、原生型的APP可以調用手機終端的硬體設備(語音、攝像頭、簡訊、GPS、藍牙、重力感應等)
8、APP應用更新新功能，涉及到每次要向各個應用商店進行提交審核。
9、用戶可以自由地選擇是否更新軟體版本，所以會出現不同用戶同時使用不同版本的情況
如果企業選擇商領雲進行定製開發原生app，需要單獨開發兩套系統即ios和安卓系統。如果是通過商領雲的在線製作app，則可以同時生成ios和安卓系統的app，並且還可以製作小程序、移動網站和微商城，非常方便，而且價格也只需幾萬左右，具體需要看功能需求。
㈣ H5前端學習後有前途嗎
H5前端學習有前途，前景廣闊是高薪行業。因此選擇好的培訓機構是重要的，好的培訓機構推薦。【達內教育】歷時一年，耗資千萬，重磅推出「因材施教、分級培優」創新教學模式，同一課程方向，面向不同受眾群體，提供就業、培優、才高三個級別教學課程，達內「因材施教、分級培優「差異化教學模式，讓每一位來達內學習的學員都能找到適合自己的課程。感興趣的話點擊此處，免費學習一下
學習任何一門語言前，了解語言前景是很好的。【H5前端】在市場需求上面，雖然沒有前幾年那麼火爆，但在中高級前端開發崗位上依舊有缺口，市場對於這類人才的需求依舊很大。並且，在待遇方面，中級開發大概在1w左右，高級開發基本算是年入百萬並不少見，所以「錢」途還是很大的。要想就業好，就要多努力，老師領進門，修行在個人。勤於動手，去落實代碼，才是不二選擇。
想了解更多有關H5學習前途的相關信息，推薦咨詢【達內教育】。該機構是引領行業的職業教育公司，致力於面向IT互聯網行業培養人才，達內大型T專場招聘會每年定期舉行，為學員搭建快捷高效的雙選綠色通道，在提升學員的面試能力、積累面試經驗同時也幫助不同技術方向的達內學員快速就業達內IT培訓機構,試聽名額限時搶購。
㈤ app內嵌h5頁面：前端與原生語言的配合
var u = navigator.userAgent,
app = navigator.appVersion;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端
if(isAndroid) {//這個是安卓操作系統
}
if(isIOS) {//這個是ios操作系統
}
if(/(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent)) {//移動端
//移動端打開
} else {
//pc端打開
}
function is_weixn_qq() {
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger\/[0-9]/i)) {
$('#weixin-tip').show();//微信引導圖（點擊右上角按鈕選擇瀏覽器打開）；
return true;
}
if(ua.match(/QQ\/[0-9]/i)) {
$('#weixin-tip').show();//qq引導圖（點擊右上角按鈕選擇瀏覽器打開）；
return true;
}
if (ua.match(/WeiBo/i) == "weibo") {
//在新浪微博客戶端打開
return true;
}
return false;
}
獲取當前url通用方法：
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if(r != null)
return decodeURIComponent(r[2]);
return null;
}
var a = getQueryString('a') ? getQueryString('a') : ''; //a為拼接的參數名
if(a == 1) {
$('.myfooter').show();
$('.box').css('padding-bottom', '1.4rem');
} else {
$('.myfooter').hide();
$('.box').css('padding-bottom', '0');
}
㈥ H5開發和web前端開發有啥區別啊
在網路上，經常看見有同學在提問，H5前端與Web前端的區別。今天我們就來好好談一下，他們之間究竟哪裡不同？
1.開發頁面時，主要使用的技術不同。Web前端在開發互動式頁面時，主流的前端技術都會用到，像HTML、CSS、JavaScript、HTML 5、jQuery、JSon
這些最基礎的技術都會涉及到。H5前端在開發頁面時，大部分是通過HTML語言來設計頁面。
2.涵蓋范圍不同。上面已經提到，Web前端開發會使用到當下主流的前端技術及框架。而H5前端是主要通過HTML標記語言來進行開發。我們也可以說H5前端是涵蓋在Web前端開發裡面。
實際上，在現實生活中，我們並沒有把這兩者分的這么清楚。因為在真正的項目開發過程中，會涵蓋到前端各種主流的技術。所以，大家只需要明白H5前端是包含在Web前端中的就足夠了。
㈦ h5和web前端有什麼區別呀
h5其實只是web前端開發中重要的一部分技術。所以h5和web前端有什麼區別這種說法本身就有問題。
web前端工程師主要是通過使用HTML、CSS、JavaScript等專業知識和工具將產品UI所設計的產品實現成網站產品並處理視覺和交互問題，它涵蓋了PC端、移動端網頁。換句話說所有用戶終端產品與視覺和交互有關的部分，都是前端工程師所做的工作。所以說前端是最接近用戶和產品設計的工作者。
同時前端還要解決許多界面和交互的問題，比如每個瀏覽器中的各個版本的兼容性、Web標准、移動設備、多終端適配等等這些問題都將是前端人員所要面臨的挑戰。所以說只有通過不斷的學習積累創造才能給用戶帶來更好的體驗。
㈧ web前端和前端的區別是什麼
前端開發包括了移動前端開發和web前端開發，前端即網站前台部分，運行在PC端，移動端等瀏覽器上展現給用戶瀏覽的網頁。如需學習相關技術推薦選擇達內教育，該機構致力於面向IT互聯網行業，培養眾多網路相關職場人才。
移動前端開發指的是Android和iOS的原生APP開發，移動前端開發屬於HTML5開發，包括H5專題頁、移動前端網頁，廣告落地頁、HybridApp等
WEB前端開發屬於HTML5開發，主要偏向PC端的網頁開發，包括PC端網頁開發、PC端後台管理頁面等，也會涉及部分的移動端網頁開發。
達內教育與眾多國際知名廠商建立了項目合作關系。共同制定行業培訓標准，為達內學員提供高端技術、所學課程受國際廠商認可，讓達內學員更具國際化就業競爭力。
想了解更多有關IT技術的相關信息，推薦咨詢達內教育。達內目前已在北京、上海、廣州、深圳等70個大中城市成立了342家學習中心，擁有員工超過10000多人，累計培訓量已學員已達100萬人次。達內憑借雄厚的技術研發實力、過硬的教學質量、成熟的就業服務團隊，為學員提供強大的職業競爭力，在用人企業中樹立了良好的口碑。
㈨ 移動前端開發和web前端開發有什麼區別
移動前端開發和 Web 前端開發的區別是:
1、前端是相對比較大的概念，一般是指用戶能夠看到、直接接觸的界面都算是前端，比如iOS界面，安卓界面，網頁界面，PC/Mac桌面軟體的界面。最常見的是Web前端，也就是針對於網頁端開發的工作。
2、Web App即Web application，也就是以瀏覽器作為客戶端的軟體。例如，用桌面客戶端來收發郵件，但也可以直接用瀏覽器登陸gmail或者QQ郵箱，直接使用網頁版的軟體來使用。總之就是使用網頁版代替本地軟體。
Mobile Web App就是在手機端打開的Web App。例如Gmail的移動端軟體
3、目前，移動客戶端的開發主要包括三種類型：
Native App（原生APP）：也就是完全使用移動設備系統語言寫的客戶端。iOS系統就是使用Objective-C語言來編寫本地應用，也可以使用蘋果於2014年蘋果開發者大會上發布的SWIFT語言；Android平台就是使用Java語言來開發。原生APP就是從界面到交互都是使用官方標准語言來編寫，效率和穩定性都是最好的，但欠缺靈活性。
Web App：這個就是在移動瀏覽器里打開的，使用Web前端開發語言HTML CSS JavaScript來開發的，基本上就是個網頁，
Hybrid App：主要使用HTML5實現。一般使用Native語言實現一個容器，然後使用HTML CSS JS來實現用戶界面和交互。這樣方式既克服了Web App容器暴露偏底層的介面這樣的問題，同時比起原生的開發靈活性要高。這樣就更新可以更方便快捷，也不依賴於市場。例如，豌豆莢其實是個PC端的hybrid app 。
對於以上三種開發方式的比較和分析搜索引擎裡面有太多的內容了，這里也就不再贅述了。
4、移動端網頁布局方法與pc的差異。
主要是css方面，外加如何做到同一url，不同客戶端展現不一致的做法，俗稱pc和mobile都兼容。還有會說一下rem的相關用法和一段比較經典的rem.js
最後總結一下：
其實這兩者最顯著的區別就是，web app是不依賴於具體的設備的，通用性較強，只要手機或PC有相應內核的瀏覽器就基本OK。而mobile的app則依賴於具體的設備，一旦更換設備，需要重新下載才能繼續使用。
移動前端開發 主要來說的是Native Client的開發Android為Java，iOS為Objective-C，然後么HTML5應用號稱跨平台其實差異很大。
Web前端開發么基本上就是HTML JavaScript CSS，不過有些人把Servelt/JSP, PHP,Ruby,Python,C#之類的只要關繫到頁面的也叫做Web前端開發。
app是應用，每個操作系統有專門的開發工具和語言
web是網頁，使用html+css+js，有工具可以生成轉化為app，不過效果一般