本文实例讲述了jquery插件开发模式。分享给大家供大家参考，具体如下： jquery插件一般有三种开发方式： 通过$.extend()来扩展jQuery通过$.fn 向jQuery添加新的方法通过$.widget()应用jQuery UI的部件工厂方式创建第一种$.extend()相对简单，一般很少能够独立开发复杂插件，第三种是一种高级的开发模式，本文也不做介绍。第二种则是一般插件开发用到的方式，本文着重讲讲第二种。 插件开发 第二种插件开发方式一般是如下定义 $.fn....
本文实例讲述了JavaScript中Dom操作。分享给大家供大家参考，具体如下： 博主将按照增删改查的方式来介绍一下Dom的主要操作。 1、增加节点 添加节点的操作主要分为3步： （1）创建要添加的新节点 （2）找到要添加到的父节点 （3）父节点添加新节点 参考代码 <!DOCTYPE html> <html> <head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title></title><link rel="stylesheet" href=""><script>fun...
Vue中util的工具函数，下面通过实例代码给大家介绍的非常详细，具体代码如下所示： // 防抖函数 function debounce (fn, wait) { let t return () => { let context = this let args = arguments if (t) clearTimeout(t) t = setTimeout(() => {fn.apply(context, args) }, wait) } } function flatten (arr) { // 数组扁平化 return arr.reduce((result, item) => { return result.concat(Array.isArray(item) ? flatten(item) : ...
本文实例讲述了JavaScript命名空间模式。分享给大家供大家参考，具体如下： 前言 命名空间可以被认为是唯一标识符下代码的逻辑分组。为什么会出现命名空间这一概念呢？因为可用的单词数太少，并且不同的人写的程序不可能所有的变量都没有重名现象。在JavaScript中，命名空间可以帮助我们防止与全局命名空间下的其他对象或变量产生冲突。命名空间也有助于组织代码，有更强的可维护性和可读性。本文旨在探讨JavaScript里的几种常见命...
排序算法的介绍 排序也称排序算法 (Sort Algorithm)，排序是将 一组数据 ， 依指定的顺序 进行 排列的过程 。 排序的分类 1) 内部排序 : 指将需要处理的所有数据都加载 到 内部存储器(内存) 中进行排序。 2) 外部排序法: 数据量过大，无法全部加载到内 存中，需要借助 外部存储(文件等) 进行 排序。 常见的排序算法分类算法的时间复杂度 度量一个程序(算法)执行时间的两种方法 1、事后统计的方法 这种方法可行, 但是有两个问题：一...
订阅发布模式定义了一种一对多的依赖关系，让多个订阅者对象同时监听某一个主题对象。这个主题对象在自身状态变化时，会通知所有订阅者对象，使它们能够自动更新自己的状态。 比如addEventListener 这个api就是个发布订阅模式 如果用过vue的同学，可以把他类比于 watch 下面我们看一个例子 var observe={fnsObj:{},// 订阅方法on:function(key,fn){if(!observe.fnsObj[key]){observe.fnsObj[key] = []}observe.fnsObj[key].push(fn...
添加参数可以减少重复的 npm script。拿 eslint 来说，传入 --fix 参数，就开启内置的代码风格自动修复模式，好智能听起来。 "scripts": {...,"lint:js": "eslint ./src/**/*.js","lint:js:fix": "eslint ./src/**/*.js --fix" }本着不 DRY 的原则，而且还会遇上复制粘贴带来的风险，可以这么巧妙的配置： "scripts": {...,"lint:js": "eslint ./src/**/*.js","lint:js:fix": "npm run lint:js -- --fix" }对面个上面命令配置， --...
本文实例讲述了JS学习笔记之贪吃蛇小游戏demo实例。分享给大家供大家参考，具体如下：最近跟着视频教程打了一个贪吃蛇,来记录一下实现思路,先上代码 静态页 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" /><title>贪吃蛇</title> </head> <style> *{margin: 0;padding: 0; }.map{width:800px;height: 600px;background-color: #ccc;position:relative;}</style> <body> <!-- 画出地图,设置样式 --><div class="m...
function judgeType(change) {if (arguments.length == 0) {return 0;//无参数传入}if (change === null) {return null}if (change === undefined && arguments.length > 0) {return undefined}if (change instanceof Function) {return function}if (change instanceof Array) {return arry}if (change instanceof Number || typeof change == number) {return number}if (change instanceof String || typeof change == string) ...
jQuery Migrate是应用迁移辅助插件，是用于高级版本兼容低级版本辅助插件。 例如jQuery版本用的是1.x，计划升级到3.x，就可以在页面删除1.x版本，换成3.x版本，如果有脚本错误，就引入jquery-migrate插件用于兼容低版本，同时也显示低版本方法替换成新版本方法的方案。 例子： <!DOCTYPE html> <html> <head><meta charset="UTF-8"><title>test</title> <script type="text/javascript" src="jquery-1.6.1.js"></script><script...
本文实例讲述了微信小程序图表插件wx-charts用法。分享给大家供大家参考，具体如下： 微信小程序图表插件（wx-charts）基于canvas绘制，体积小巧，支持图表类型饼图、线图、柱状图 、区域图等图表图形绘制，目前wx-charts是微信小程序图表插件中比较强大好使的一个 支持图标类型 饼图 pie圆环图 ring线图 line柱状图 column区域图 area雷达图 radar如何使用？ 1. 直接引用编译好的文件 dist/charts.js（js下载地址） .wxml中定义 <...
父组件向子组件通信 业务场景：现在我要在父组件点击一个回退按钮，这个回退会传进子组件中（子组件中有两步进程），子组件来处理。 解决方案 起初我是父组件通过props传值，但是发现只有组件第一次加载时才能传值，通过事件改变的父组件值并不会再通过过props传递，也就是说props只有加载组件时才会工作，并不会根据值改变动态操作 后面，我是通过操作dom的方法，this.$refs.children这样直接操作子组件 <ProgressTwo ref="progre...
你是公司的程序员，年会的时候公司要给员工抽奖发福利，要求你写一个页面小程序，用来随机选出幸运员工，分设一二三等奖大致如下图示例: 以下是点名器的一种思路，页面比较简陋，只给出了满足最基本要求的代码户要用到计时器，随机数函数等 本抽奖一二三等奖都只设一名幸运员工，开始结束功能用一个按钮实现 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>点名器</title><style>.title{font-size:50px;f...
本文实例讲述了微信小程序登录数据解密及状态维持。分享给大家供大家参考，具体如下： 学习过小程序的朋友应该知道，在小程序中是不支持cookie的，借助小程序中的缓存我们也可以存储一些信息，但是对于一些比较重要的信息，我们需要通过登录状态维持来保存，同时，为了安全起见，用户的敏感信息，也是需要加密在网络上传输的。 前台，service。封装了http请求，同时封装了getSession（通过code获取服务器生成的session）、getUserI...
$root vue状态管理使用vuex,如果项目不大，逻辑不多，name我们没必要用vuex给项目增加难度，只需要用$root设置vue实例的data就行了，如下 main.js new Vue({data(){return{loading:true}},router,store,render: h => h(App) }).$mount(#app)a.vue created(){ console.log(this.$root.loading) //获取loading的值 }b.vue created(){ this.$root.loading = false; //设置loading的属性 }$parent parent能够访问父组件的属性和方法 pa...