1 / 34
文档名称:

微信小程序详解.doc

格式:doc   大小:455KB   页数:34页
下载后只包含 1 个 DOC 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

微信小程序详解.doc

上传人:镜花水月 2019/11/10 文件大小:455 KB

下载得到文件列表

微信小程序详解.doc

相关文档

文档介绍

文档介绍:--------------------------校验:_____________-----------------------日期:_____________微信小程序详解黑马程序员:微信小程序详解概念介绍相信最近各位同学已经被各种关于微信小程序的介绍刷屏了,大家应该也关心这个新兴起的东西,但是对于我们Android开发的同学,或者对于我们iOS开发的同学,可能很难马上上手去做,也很难去理解这是一个什么东西,那这篇文章就从理论上简单的向大家说明以下几个问题微信小程序是什么微信小程序开发所使用的技术栈,以及对它的细致讲解微信提供的小程序开发框架相信通过这篇文章,起码大家对于微信小程序会有一个更直观的认识,也能上手进行一些简单的开发接下来看第一个部分的内容,微信小程序是什么,在这之前先看一下官方的解释我们提供了一种新的开放能力,开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播,同时具有出色的使用体验。微信小程序是什么首先微信小程序这五个字中最重要的有两个词,一个是小,一个是程序,我们分别来看这两个词所表达的意思程序首先是程序一词,微信小程序所提供的体验是原生的,而不是H5,理论上微信小程序提供的是完全原生的体验 那微信是如何实现的呢?总体上微信借助了ReactNative的四项,那ReactNative在下面我会简称为RN,关于RN具体的介绍请参照ReactNative中文网,而微信小程序基本上就是基于RN的框架设计原理自己鼓捣了一个轮子,为什么我这么说,我有没有证据?请参照微信小程序框架原理也就是说,微信就是一个云操作系统,你可以开发程序,运行在微信中,你的这个程序是完全类似于原生的体验,就像你使用Android的SDK开发一个程序,运行在Android手机中一样,而你为微信开发一个程序,可以运行在Android上,iOS上,所有有微信的地方,你的程序都可以运行看到这里,就会有很多同学觉得,我靠,那我的Android白学了,那我的iOS白学了,其实是不然的,接下来我们再来看看微信小程序中的小字小虽然微信小程序能够提供近似原生的体验,但是大家不用慌张,微信小程序还远不可能代替原生应用,有如下两个原因首先,微信再大再完整,也只是一个程序,在微信里面玩<炉石传说>这种大型游戏,想想就觉得难受其次,微信运行在iOS和Android中,本身微信就是受限的,苹果也不可能让微信把自己的命给革了,所以微信小程序本身也会受到很多限制但是客户端开发者还是有必要了解一些微信小程序的开发,这样也能做到知己知彼技术栈这个章节简单的介绍一下微信小程序所使用到的一些知识,并且对这些知识进行一些简单的了解,大概有如下的几个方面HTMLCSSJSHTMLHTML类似于我们经常用到的layout,是一种类似于XML的文档语言,使用标签来描述一个页面的结构来看一个简单的HTML例子<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>HelloWorld</title></head><body><imgsrc=/><ahref=>这是一个超链接</a></body></html>上述例子中的一些概念html,head,body叫做标签,标签有标签的名称img是一个图片标签,通过img的属性src可以设置图片的路径,通过路径找到图片a标签是链接标签,通过href来设置链接到的目标,而a标签开闭标签之间的叫做标签内容,a标签的内容是标签显示在页面中的文本这就是一个常见的html结构,可以复制并且查看,通过这个例子,大家基本上就已经能够掌握HTML的语法了,和我们的layout非常类似,但是要注意想a标签这样的标签写法,和我们平常的写法略有不同HTML掌握到这里已经差不多了,不用太过深究,这些标签在微信小程序的开发中基本上没用,微信有一套自己的标签组件,但是一定要理解这种写法才行CSS刚才我们已经见过HTML的写法了,下面来简单的看一下CSS的一些基本特点 首先,HTML用来描述页面结构,这一点很重要,也就是说,HTML主要的作用是描述页面上有什么元素,大致的排列,大致的顺序,而不关心页面长相 那元素(或者我们称之为控件)的长相,例如什么字体大小,什么颜色等,这些长相或者叫表现上的东西,通过CSS来描述,包括相对的位置等,都是CSS来描述为了说明CSS的作用和写法,我们对刚才的程序做一个扩展<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>HelloWorld</title><style>.img_simple{border:c;padding:5px}</style></head><body><imgclass="img_simple"