你知道Web前端与HTML5技术的区别吗？

1. 什么是Web网页开发

以一个网站平台为例包括网站制作、网页开发、软件开发等。网站制作就是说网站的外形，平面的东西，软件开发也好理解就是说功能完成。而网页开发，简单来讲，就是说把平面效果图转换成网页，把静态转换成动态。出色的网页开发可以确保完成某些实际效果的同时，即不可影响网站的开启效率、浏览器兼容性还有搜索引擎的收录，还可以让用户体验更加舒适，使网站在访问中显得更精细、更用心。访客使用起来更简便。

2. Web网页开发学什么?

学习学习HTML、CSS、DIV+CSS技术制作网页的Java、DOM、BOM等学习开发基础的 photoshop和Axure等软件应用程序， 在NodeJS和PHP完成页面UI的设计，识别数据库等后端语言，学习 HTML5、CSS3、应答页面的布局、微站点的制作等，开发移动互联网应用的现在， 网页的开发最受欢迎，要人最多的是使用canvas开发网页游戏动画，或者使用 Cocos2d-js制作游戏等开发。

3. 什么是HTML5?

HTML5就是说HTML最新标准，是现在Web软件开发的核心、标准通用标记语言下的一个应用HTML的第五次重大修改，这是一项推荐标准。从技术本身的分析来看，目前已经完成了一些网页制作、web应用、微网站开发、web游戏等工作，目前已经完成了HTML5标准。

4. 前端与HTML5的区别?

HTML5其实只是网页开发中重要的一部分技术，是现在网页开发的标准组件，特别是在移动端的特效开发、游戏开发，以及APP的开发方向上非常流行。比如建设网页开发的“大楼”，HTML5相当于“钢筋混凝土”。

所以现在你清楚了前端和HTML5的区别了吗?如果你有一颗想转行的心，Web前端无疑是一个很好的选择，如今IT行业发展形势大好，软件开发人员匮乏，未来几年前端开发都将是高薪行业。

weex使用navigator进行页面跳转，这种方式是使用的url传参，刚开始使用的时候一直都是用下面这种方法传值：

navigator.push({

url: config.getWeexIp() + '/app/main.js?account=123456&name=jelly'

})

url中？后面便是携带的参数，ccount=123456&name=jelly就是代表两个参数，一个account，一个name。

在跳转后的页面通过获取url地址，便可以得到这两个值。但和android不同的是，在ios系统中，是不支持中文的，也就是说如果url是'/app/main.js？account=123456&name=杰尼'，便会获取不到name数据，所以在最开始拼接url时需要encodeURIComponent方法转码，在拿到数据后在使用decodeURIComponent方法解码拿到正确的数据。

上面这种方法在需要传递的数据较少时很方便，但是实际开发中，数据往往都是一个json对象，需要传递的参数也很多，这样一来，url的拼接往往会变得很繁琐，因为需要将json对象中的数据单独一个一个提取出来传递.例：

假如有一个json对象格式如下：

data:{

account : 123456,

name : 杰尼,

}

url就会变成：

'/app/main.js?account='+data.account+'&name='+ encodeURIComponent(data.name)

获取到url地址后需要执行下面两条语句拿到数据：

account=url.account

name=decodeURIComponent(url.name) //解码

这只是两条数据，如果数据有十条以上，代码会变得很冗余，出错概率也会变大。

在写项目《XXXX》时开始思考能不能和原生Android一样，将一整个对象打包传递。之后，我找到了两个函数方法：

JSON.stringify() //将对象转换为json字符串

JSON.parse() //将json字符串转换为对象

虽然url不支持拼接对象，但是支持字符串啊，所以我可以把url写成：

'/app/main.js?data='+JSON.stringify(data)

获取数据时：

data=JSON.parse(url.data)

传递数据时，把对象转成json字符串传过去，在第二个页面获取到json字符串后，再转成对象，这样就完成了对象的传递。

需要使用account数据时，可以直接充data对象中拿：data.account

这种方法，代码量很少，同时也可以减少出错的概率，因为去除了抽取对象数据进行传递的步骤,避免出现参数名编写错误等bug。

但是仅仅这样也还不行，因为对象转成的json字符串中也是有可能出现中文的，比如data.name这个数据。所以同样需要做转码解码处理，最终的url：

'/app/main.js?data='+encodeURIComponent(JSON.stringify(data))

获取对象数据：

data= decodeURIComponent(JSON.parse(url.data))

整个传参过程就这两行核心代码。

uni-app App端内置weex渲染引擎，提供原生渲染能力

然而， Weex并不是一个前端框架 。实际上，前端框架仅仅是 Weex 的语法层或称之为 DSL (Domain-specific Language)，它们与原生渲染引擎是分离的。换句话说，Weex 并不依赖于特定的前端框架，随着前端技术的发展，Weex 也可以集成更多广泛使用的前端框架。

以往的 weex ，有个很大的问题是它只是一个高性能的渲染器，没有足够的API能力，使得开发时非常依赖原生工程师协作，开发者本来想节约成本，结果需要前端、iOS、Android 3拨人开发，适得其反。而 nvue 解决了这个大问题，让前端工程师可以直接开发完整 App，并提供原生插件的市场交易和云打包。这些组合方案，开发者切实的提高效率、降低成本。

如果你是web前端，不熟悉 weex，那么建议你仍然以使用 vue 为主，在App端某些 vue 表现不佳的场景下使用 nvue 作为强化补充：

uni-app App 端内置 HTML5+ 引擎，让 js 可以直接调用丰富的原生能力。

小程序及 H5 等平台是没有 HTML5+ 扩展规范的，因此在 uni-app 调用 HTML5+ 的扩展规范时，需要注意使用条件编译。否则运行到h5、小程序等平台会出现 plus is not defined错误。

在普通的 H5+ 项目中，需要使用 document.addEventListener 监听原生扩展的事件。

uni-app 中，没有 document。可以使用 plus.globalEvent.addEventListener 来实现（注意manifest中需开启新编译器，即自定义组件模式"usingComponents":true）。

同理，在 uni-app 中使用 Native.js 时，一些 Native.js 中对于原生事件的监听同样需要按照上面的方法去实现。

注意：旧编译器（非自定义组件模式）不支持 plus.globalEvent 这个对象。

---