weixin_44827643的博客

该组件作为父组件，内部又划分为三个组件，分别为cart-title、cart-list、cart-total，对应购物车的标题、列表以及总价区域。为两个按钮绑定点击事件，为输入框绑定失去焦点事件。在父组件中定义list数据，通过props传给总价组件，在计算属性中利用reduce方法得出总价。在父组件中定义uname数据，通过props属性传给标题组件。商品列表组件功能的实现是购物车最重要的部分，相对来说功能较复杂。划分完成后，则将静态布局的代码放置到对应组件的模板中。在父组件中绑定自定义的监听事件。...

本文主要介绍JavaScript中async和await修饰符的使用，async和await两种语法的结合可以让异步代码像同步代码一样。

本文主要介绍如何利用Vue.js制作简单的加法器。效果如图： 代码如下：

本文主要介绍JavaScript中面向对象的使用。在介绍之前，先介绍ES5中构造函数的使用。ES6提供了面向对象的方法：面向对象使用constructor构建对象，可定义公有属性和静态变量。面向对象提供了继承的方法，通过extends关键词可继承某类的属性和方法。现定义Male类，继承上面定义的Human类，即可获取Human类的属性和方法。此外，在子类中，可定义私有属性进行使用。 在父类的基础上，子类可利用constructor构造新的构造函数面向对象提供了get和set方

本文主要介绍如何利用Swiper插件快速制作轮播图效果。下面是Swiper插件的官方网站。Swiper中文网-轮播图幻灯片js插件,H5页面前端开发Swiper(Swiper master)是目前应用较广泛的移动端网页触摸内容滑动js插件。Swiper中文网提供Swiper在线演示、Swiper中文教程、Swiper中文APi、Swiper下载。https://www.swiper.com.cn/ 1.进入官网，下载Swiper文件 2.页面引入Swiper的css及js文件3.搭建网页结构.swip

目录1.轮播布局2.JS动态效果（1）根据图片个数得到图片列表区域的宽度（2）根据图片个数创建相应的圆点并为每个圆点绑定自定义属性 （3）通过事件委托给圆点切换区域绑定点击事件，根据圆点的自定义属性值进行相应的切换 （4）通过定时器设置图片自动切换的效果3.解决bug本文主要介绍如何利用原生JS实现简单的轮播图效果，主要分成三大步骤。轮播区域是由一个大模块包裹，设置固定宽高。内部分为图片列表区域和圆点切换区域。图片列表区域存放的是轮播图的图片，圆点切换区域用于后期动态切换图片，由图片个数动态生成。（2

本文主要介绍如何利用JS以及定位实现元素的减速运动。盒子向右进行减速移动，移至300px处即停止通过目标位置的值减去盒子距离屏幕左侧的距离，即可得到盒子每次移动前距离目标位置的值。每次盒子移动的距离都是所剩距离的十分之一，循环往复，直至到达目标位置。由于JS小数的计算存在精度问题，故需要进行取整操作。代码如下：效果如图：...

本文主要介绍如何利用事件对象、元素的offset属性以及事件的绑定制作登录框拖曳的效果，如图所示。 代码如下：核心思路：为拖拽区域先绑定鼠标按下事件，利用事件对象的pageX和pageY以及元素的offsetLeft和offsetTop属性获取鼠标距离登录区域左边界和上边界的距离，再给页面绑定鼠标移动事件，根据新的pageX等距离并结合前面所获得的的鼠标距离，将两者之差赋值给登录区域的top及left，即可实现拖拽效果。最后为页面绑定鼠标弹起事件，待拖拽至目标区域后，松开即可完成拖拽效果。这里需要的注意的是

本文主要介绍如何利用JS及html实现页面之间数据的传递，以登录之后显示用户信息为例进行讲解。1.会话存储的使用：将用户输入的登录信息存储于会话存储空间中，当跳转至另一页面后，利用该存储空间中的信息即可进行显示。代码如下：登录页面： 首页：2.location.search的使用：利用form表单的action属性或location的href属性可实现页面的跳转及数据在网址上的显示，之后利用location.search并结合字符串方法的使用即可获取相应的登录信息。利用form的action属性

本文主要介绍如何利用元素的距离属性实现图片放大镜的效果。代码如下：

本文主要介绍留言板的制作，用户可对新闻消息进行评论，发表之后评论会被置于顶端，点击相应删除按钮即可删除。本文主要介绍两种方式，区别在于如何实现评论的删除。1.在函数的局部作用域内完成删除事件的绑定，可以实现“点哪个删哪个评论”的效果。代码如下：2.通过事件委托的方式，给评论模块的父级绑定事件，通过e.target属性的应用完成删除功能。代码如下：......

本文主要介绍如何通过JS实现tab栏的切换效果，主要介绍三种方式：1.利用自定义属性；2.利用let关键字；3.利用事件对象1.利用自定义属性此种方法的核心在于给每个tab选项设置一个自定义属性值，然后根据相应的属性值找到对应的内容选项进行显示。代码如下：2.利用let关键词此种方法相较于第一种更加简单，利用let提供的块作用域特点，直接利用各个选项的索引值即可获取相应的内容进行显示。代码如下：3.利用事件对象。前两种方法所做出来的tab栏是单一的，若要进行代码的复用，则会出现问题。利用事件对象

JavaScript第三变量的应用

统计字符串中出现次数最多的字符及相应次数