1.查看标签 - 用于替换HTML中的DIV标签

2. html中跨度标签的文本标签相似

1）文本标签

2）仅巢文本标签

3）只有文本标签具有通过长按文本复制复制的功能

4）您可以编码空间并返回运输

使用文本标签的属性，长按并复制文本单词

编码文本内容并使用文本标签的属性。如果未使用属性，文本标签将打印出编码内容，例如（空格），而无需编码空间或其他标识符内容。

长按复制  文本解码 <

3。图片标签

1）必须是互联网上的图片链接

2）默认宽度，默认高度

3）SRC属性指定加载路径

4）模式属性确定图像内容如何适应图像标签的宽度和高度

（1）默认值不能保持纵横比缩小图片的比率，因此图片的宽度和高度已完全拉伸并充满了元素

（2）保持纵横比并确保显示图片的长边 - 通常使用页面旋转木马

（3）保持纵横比缩小图片，仅确保可以完全显示图片的短两侧 - 少使用

（4）过去，指定了Web图像的宽度，并根据比例调整高度 - 常用

（5）类似于以前的

5）迷你程序中的图片直接支持懒惰加载懒负载（懒惰加载：当图片出现在视口的上下屏幕的高峰之内，并自己开始加载图片时，您将自己判断）

可以在WXSS中指定的表达方式

image{ box-sizing: border-box; border: 1px solid red; width: 300px; height: 200px; }

4。旋转图表标签

1）轮旋图的外容器 -

2）每个旋转木马项目 - 项目

3）标签的默认样式％存在，并且标签的默认宽度和高度也存在320*240

注意：无法通过像素伸出的高度

4）给定宽度和高度的方法：

首先计算原始图像的宽度和高度比，以获得顶部宽度和高度

宽度/高度=原始图像宽度/原始图像的高度

高度=宽度 *原始图像高度/原始图像宽度（大众）

100％表示占用的宽度和页面的整个宽度等于

swiper { width: 100%; height: calc(100vw*300/600); } image { width: 100%; }

5）属性 - 自动旋转木马

6）属性 - 将轮播时间单元修改为毫秒

7）属性 - 运行旋转木马

8）-dots-播放面板指示点在旋转木马期间

9） - 指示器未选择的颜色

10）----选择指示器的颜色

5。导航标签

1）导航组件 - 是一个块级元素，默认情况下将包裹线路，并且可以直接增加宽度和高度。

2）URL属性是需要重定向的页面路径，该路径可以是绝对路径或相对路径

注意：请注意，路径为'/'

3）跳到当前或其他小程序的页面是否属性？

迷你程序页面的自默认值

其他微型程序页面

4）开放型属性是跳跃的方式

（1）默认值保留当前页面并跳到应用程序中的页面，但无法跳到页面

（2）关闭当前页面并跳到应用程序中的页面，但不允许跳到页面

（3）跳到页面并关闭所有其他非页面

（4）关闭所有页面并在应用程序中打开页面

（5）关闭当前页面，然后返回到上一个或多级页面。您可以通过（）获取当前页面堆栈，并确定需要返回的层。

（6）退出将退出迷你程序，并在=“”时生效

点此跳转轮播图页面 跳转tabber页面 点此再次跳转

在这里，我们演示默认值，三个开型跳跃方法

单击open-type =“”按钮，我们发现有一个返回按钮可以逆转，因此这意味着当前页面尚未关闭。

单击Open-Type =“”按钮并跳到页面，但是没有返回按钮，这意味着当前页面已关闭。

单击“打开类型” =“”按钮，然后跳到旋转木马页面。没有返回按钮表示当前页面已关闭。

6.富含文本丰富的文本标签

使用属性实现

1）接收标签字符串 - 最常用

将一块代码在其他地方取出，然后将其放在JS变量中，使用字符串变量存储，然后在HTML文件中使用它来接收字符串。

2）接收数组对象 - 我不明白

页JS文件

// pages/rhtext/rtext.js Page({ /** * 页面的初始数据 */ data: { //对象数组 html: [{ //1 div标签 name属性来指定 name:"div", //2 标签上有哪些属性 attrs: { //标签上的属性 class style class:"my_div", style:"color:red;" }, //3.子节点children要接收的数据类型和nodes第二种渲染方式的数据类型一致 children: [{ name:"p", attrs:{}, //放文本 children: [{ type:"text", text:"hellow" }] }] }] } })

页面HTML文件

7。按钮标签

外观风格

1）尺寸属性

默认大小

迷你小尺寸

2）类型属性

灰色的

绿色的

警告红

3）属性定义按钮被挖空，背景颜色是透明的

4）在属性定义按钮名称之前是否有加载图标

按钮 按钮 按钮

发展能力

1）直接打开，客户服务对话功能需要在微信中的背景中配置

只有真正的机器调试

2）将当前的迷你节目转发给微信朋友，并且无法与您的朋友圈子分享迷你程序

3）获取当前用户的手机号信息并将其与事件结合使用 - 它不是企业的Mini 帐户，也没有许可获得用户的手机号码

（1）绑定事件

（2）通过事件的回调功能中的参数获取信息

（3）获得的信息已加密

用户需要自己构建Mini程序的后端服务器，在后台服务器中解析手机号码，然后返回到Mini程序以查看信息。

4）获取当前用户的个人信息

（1）使用方法类似于获取用户的手机号码

（2）可以直接检索，并且没有加密字段。

5）直接在小程序中打开应用程序

（1）您现在需要通过应用程序中的链接打开小程序

（2）通过Mini程序中的此功能重新打开应用程序

（3）测试：找到JD应用程序并找到另一个JD小程序

6）打开小程序的内置授权页面

只有用户单击的权限才会出现在授权页面中

7）打开小程序的内置反馈页面

只有真正的机器调试

获取用户手机号码和个人信息的接口功能已绑定到该按钮，因此可以使用。

Page({ //获取用户的手机的号码信息 getPhoneNumber(e) { console.log(e); }, getUserInfo(e) { console.log(e); } })

contact share getPhoneNumber getUserInfo launchApp openSetting feedback

8. ICON图标标签

小程序中的图标字体图标

1）类型属性是图标类型

||信息|警告||||||

2）大小属性是图标尺寸

3）属性是图标颜色

9。广播盒标签

1）标签必须与父元素一起使用。如果要获取用户选择的内容，则只能绑定接口函数。

2）在属性中选择的无线电框的值属性是所选择的无线电框的颜色。

3）需要给予界限

4）所选值需要在页面上显示

接收选定的内容并获取所选无线电框的值。您可以首先打印它以查看无线电框的位置，然后分配。

// pages/icon/icon.js Page({ /** * 页面的初始数据 */ data: { gender:"" }, handleChange(e) { //console.log(e); //1.获取单选框中的值 let gender=e.detail.value; //2.把值赋给data中的数据 this.setData ({ gender//相当于gender:gender }) } })

男 女 选中的是：{{gender}}

10。复选框标签

同样，它也必须与 - 并使用 - 结合来检查事件功能。

Page({ data: { list:[ { id:0, name:"", value:"apple" }, { id:1, name:"", value:"grape" }, { id:2, name:"", value:"banana" } ], checkList:[] }, //复选框的选中事件 handleCheckBox(e) { //1.获取被选中的复选框的值 const checkList=e.detail.value; //2.进行赋值 this.setData({ checkList }) } })

它是一个空白的数组，可存储所选内容的值，使使用循环渲染更加方便。

{{item.name}} 选中的水果：{{checkList}}