时间线

vue 2014年对外发布

uniapp 2015年对外发布

微信小程序，2017公测，对外发布

题主2013年毕业，从事互联网开发，这几个刚好碰上。从前后端不分离到分离，Html4到html5时代。

技术栈

作为前端技术，核心为html+css+js，html+css没啥难度，各百来个单词，之前的文系美工就能做的，俗称“页面仔”，上手方便。现在叫“前端工程师”，主要是前后端分离时代。

html+css+js扎实，对于很多开源的UI框架，如WeUi（腾讯官方UI）、UViev、TouchUI WX、IView（TalkingData）、lin-ui、vant（有赞），colorUI、TaroUI（京东）、WuxUI、MinUI（蘑菇街）

开发就区分两种：

原生小程序和uniapp搭配上面的UI框架。

DOM标签对比

标签	微信小程序	uniapp	Html5	备注
块标签	view	view、div	div、section、【dl，dt】、【ol，li】【ul、li】、【h1-h6】	微信小程序和uniapp比较少和SEO有关系（除了移动端h5）没有html那么多的花里胡哨
行内标签	text	text	span、em、strong、a、font	通用span，微信和uniapp的text就够用，html5比较花哨，<aaa></aaa><bbb></bbb>都可以，基于语义化，常用几个标签即可一般的，块元素包行内元素，行内元素不包行块元素、行内元素
链接导航	<navigator url="/pages/index/index" hover-class=“none” open-type="navigate" ></navigator>	<navigator url="../component/Header" ” ></navigator>	<a href="url"></a>	原生和uniapp的一样 hover-class=“none” 默认去点击（hover）的样式 open-type="navigate" 跳转方式，对应js的wx.switchTab、wx.navigateto、wx.redirectTo uniapp的就是 uni.switchTab，uni.redirectTo，uni.redirectTo 这个三个区别就是一个跳非自定义底部菜单tabbar，一个是最多跳10次的，再点就点不动，对应返回一个是redirectTo，直接一次层级，不存在返回
图片	image	image	img	原生和uniapp一样，提供mode13个情况，图片的显示方式，图片变形的low表现方式，总有一个适合的，看业主接受方式
表单	form、button、lable、input、checkbox、radio、picker、picker-view、slider、switch、textarea	form、button、lable、input、checkbox、radio、picker、picker-view、slider、switch、textarea	input、button、textarea、label大致相同	差异较多
外嵌	web-view	web-view	iframe
滑动标签	scroll-view	scroll-view	-	支持横向竖向滑动
轮播	swiper	swiper	-
拖动	movable-area	movable-area	-	一个按钮全屏拖动，侧边拖动效果
媒体标签	audio、map、video、canvas、camera、live-player、live-pusher、void-room	audio、map、video、canvas、camera、live-player、live-pusher、void-room	video、audio、enbed、source、track	img也是媒体标签，频率高放上面了
覆盖原生的视图	cover-view cover-image	cover-view cover-image	-	想做个按钮覆盖video，小程序和uniapp的这个标签就上场了 map、video、canvas、camera、live-player、live-pusher
开放数据-关注公众号	official-account	official-account	-	关注公众号组件基于扫码场景，不扫码就没有展示这个组件
开放数据-广告	ad-custom	ad-custom	-	广告模板
微信客服	<button open-type="contact"></button>	<button open-type="contact"></button>	-	需要微信小程序后台设置才能收到用户发的消息

微信小程序开发（原生和uniapp）DOM标签对比介绍相关推荐

微信小程序开发原生与框架对比
1.为什么使用框架 (1) 原生微信小程序工程化差.不支持node (2) 原生微信小程序语法比较奇怪还需要我们学习新的一套语法. (3) 微信小程序的开发者工具开发体验较差. (4) 使用框架可以使 ...
微信小程序开发实战（二）UI组件介绍 Vant Weapp
微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/ 1 第三方组件库 Vant We ...
微信小程序开发、uni-app开发、腾讯AI、百度AI
目录 1.微信小程序开发 2.uni-app开发 3.腾讯AI 4.百度AI 5.微信小程序开发与uni-app开发 1.微信小程序开发以下是微信小程序的API,可以在里面进行查阅微信开放文档微 ...
JEECG社区微信小程序开发实战-张代浩-专题视频课程
JEECG社区微信小程序开发实战-511人已学习课程介绍微信小程序开发培训,包含环境搭建.实例讲解.对接支付功能等课题. 课程收益微信小程序开发培训,包含环境搭建.实例讲 ...
微信小程序开发笔记进阶篇③——onfire.js事件订阅和发布在微信小程序中的使用
文章目录一.前言二.onfire.js介绍三.API介绍四.实例应用五.onfire源码六.实例源码一.前言微信小程序开发笔记--导读二.onfire.js介绍一个简单实用的事件订 ...
微信小程序开发工具介绍及安装（下）
开发工具的基本功能介绍微信小程序开发工具是一款强大的集成开发环境(IDE),旨在帮助开发者更便捷地创建.调试和发布微信小程序.它提供了丰富的功能和工具集,下面将对微信小程序开发工具的基本功能进行详细 ...
微信小程序开发uni-app 跨域处理服务器搭建仓库 VueX tabBar
一.uni-app简介官网:https://uniapp.dcloud.io/ PC端:移动端:(APP,WebApp):纯原生:(IOS,Android ) 应用商店:H5 Hybrid 模式(混 ...
uniapp手写_【转】uni-app框架纯手写微信小程序开发左侧滑动菜单
本帖最后由 fengrui99 于 2020-7-22 14:38 编辑原文来自:在学习的uni-app的微信小程序开发路上慢慢开始不一直依赖插件(但是使用插件是真的香,一直用一直香) 在大佬的指引 ...
uniapp 微信小程序开发图片上传压缩
uniapp 微信小程序开发图片上传压缩安卓上传图片并压缩思路全部代码安卓上传图片并压缩由于后端接口对图片的大小有限制,所以在上传图片是需要压缩处理: uni.chooseImage({c ...
微信小程序原生开发功能合集一：微信小程序开发介绍
一.专栏介绍本专栏主要内容为微信小程序常用功能开发过程的介绍说明,包括开发微信小程序常用组件的封装.常用功能的开发等,提供源代码.开发过程讲解视频.完整的课程等. 组件封装: 下拉选择组件. ...

微信小程序开发（原生和uniapp）DOM标签对比介绍

时间线

技术栈

DOM标签对比

微信小程序开发（原生和uniapp）DOM标签对比介绍相关推荐

最新文章

热门文章