js插件
关注
分享
扫一扫
Albert_Tiger
学而不思则罔，思而不学则殆。
展开
-
根据属性判断对象的假值
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <原创 2020-06-27 22:16:17 · 385 阅读 · 0 评论 -
高阶函数之节流与防抖
节流和防抖在我们的日常代码中经常会遇到，下面我们来认识一下节流和防抖的应用场景以及它们的定义。定义相同点：两者的前提都是频繁触发不同点：节流：是确保函数特定的时间内至多执行一次。防抖：是函数在特定的时间内不被再调用后执行。应用场景节流：函数节流的应用场景一般是onrize，onscroll等这些频繁触发的函数防抖：输入框搜索自动补全事件，频繁操作点赞和取消点赞等等防抖...原创 2019-08-17 08:30:58 · 249 阅读 · 0 评论 -
高阶函数之柯里化函数
柯里化函数currying又称部分求值。一个currying的函数首先会接受一些参数，接受了这些参数之后，该函数并不会立即求值，而是继续返回另外一个函数，刚才传入的参数在函数形成的闭包中被保存起来。待到函数被真正需要求值的时候，之前传入的所有参数都会被一次性用于求值<!DOCTYPE html><html lang="en"><head> &...原创 2019-08-16 22:42:38 · 148 阅读 · 0 评论 -
智能提示
<!doctype html><meta charset="utf-8"><style type="text/css"> body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; ...原创 2018-06-08 16:29:01 · 238 阅读 · 0 评论 -
jq模拟手机端滑动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><met原创 2018-06-08 16:13:14 · 874 阅读 · 0 评论 -
js自定义滚动条
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> ..原创 2018-06-08 16:11:54 · 204 阅读 · 0 评论 -
vidoe进度条
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>HTML5-Video-Player</title> <style type="text/css"&原创 2018-06-07 10:21:09 · 552 阅读 · 0 评论 -
百叶窗
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>jQuery多种百叶窗风格切换焦点图插件DEMO演示</title><link rel="stylesheet" href=&原创 2018-06-06 20:58:43 · 353 阅读 · 0 评论 -
百度地图
$(function(){ var BMapInit=function(){ var map = new BMap.Map("Bmap"); // 创建地图实例 var point= new BMap.Point(113.730047,22.982745); // 创建点坐标...原创 2018-06-06 20:57:05 · 176 阅读 · 0 评论 -
视频进度条
<!DOCTYPE HTML><html> <head> <meta charset="gbk"> <title>视频播放</title> <style> #box{ width:500px;原创 2018-06-06 16:31:05 · 997 阅读 · 0 评论 -
轮播图
废话不多说，直接上代码&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&原创 2018-06-06 16:13:34 · 166 阅读 · 0 评论 -
原生js实现双向数据绑定
js实现双向数据绑定<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0&quo原创 2018-04-27 17:33:49 · 525 阅读 · 0 评论 -
数值加逗号
toThousands(23456.89) // '23,456.89'方法一循环使用 slice(-3)获取每组数字。function toThousands(number) { var arr = String(number).split('.'); var num = arr[0], result = ''; while (num.length > 3) { ...转载 2018-04-08 17:15:44 · 310 阅读 · 0 评论 -
video 视频时间格式化（s => 00：00：00）
这个地方if else 很多可以用return 或者策略模式优化，做出来的小伙伴可以分享给我function MillisecondToDate(msd) { let time = parseFloat(msd) /1000; if (null!= time &&""!== time) { if (time >=60&& t...原创 2018-04-04 15:30:46 · 984 阅读 · 0 评论 -
代码管理工具之github
1.在github网站上注册一个账号：https://github.com 2.下载git：git-for-windows.github.io/ 3.设置账号git config --global user.name "Your Name"git config --global user.email "email@example.com"4.克隆代码：git clone http...原创 2018-03-26 17:11:26 · 1687 阅读 · 0 评论 -
js之难点笔记
前言 由于工作需求重新回顾了一下JavaScript，以下内容是我以前的学习笔记和其他参考资料整理完善后的内容，都是常用到的，使用频率比较高的，自己必须得精通的知识点的总结，便以后再复习参考。第一章 JavaScript原型对象与原型链1.1 构造函数的缺点自定义对象时，以构造函数为模板，对象的属性和方法，可以定义在构造函数内部。每当获取对象时都会在内存中创建新的对象属性和方法，这既...转载 2018-03-21 10:54:30 · 131 阅读 · 0 评论 -
js数组方法
1.数组的添加和删除 push()方法在数组的尾部添加一个或者多个元素 a = []; a.push(“zero”) // a = [“zero”] a.push(“one”,”two”) // a = [“zero”,”one”,”two”]; 在数组的尾部删除一个元素方法是pop()方法,原理是使数组的长度减少1，并返回被删除的元素。 2、join()...转载 2018-03-20 13:09:27 · 231 阅读 · 0 评论 -
视频直播技术之HLS 如何播放m3u8格式
引言 在H5新标签video诞生之前，基本上所有直播都是用flash实现的。常用的流媒体协议主要有 HTTP 渐进下载和基于 RTSP/RTP 的实时流媒体协议，这两种协议是完全不同的实现方式。主要区别如下： 1. 一种是分段渐近下载，一种是基于实时流来实现播放 2.协议不同，HTTP 协议的渐近下载意味着你可以在一台普通的 HTTP 的应用服务器上就可以直接提供点播和直播服务 3.延迟...原创 2018-03-19 15:28:01 · 23177 阅读 · 2 评论 -
js之动态弹幕
动态代码如下：本来想用 requestAnimationFrame()实现一个递归刷新，发现又jq的animate(),就偷个懒了。<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"原创 2018-03-17 19:15:17 · 296 阅读 · 0 评论 -
国际化示例
html代码<p class="interpret">中国</p><p class="interpret">美国</p><p class="interpret">德国</p><p><button id="toggle原创 2018-03-13 10:31:56 · 153 阅读 · 0 评论 -
原生JS实现粘贴到剪贴板
目前常见的实现粘贴到剪贴板主要有以下两种方法：第三方库 clipboard 原生JS, 主要是 document.execCommand方法 第一种方法按照文档说明，设置触发元素的data-clipboard-text 或者 data-clipboard-target即可，不做说明，详见文档第二种方法： document.execCommand这个方法的兼容性其实不算很好，特别是...转载 2018-03-12 14:20:30 · 3300 阅读 · 0 评论 -
全屏
JavaScript控制浏览器全屏css代码 <style> html,body { padding: 0; margin: 0; height: 100%; } body { background: url("2.jpg")...原创 2018-02-24 11:38:31 · 134 阅读 · 0 评论 -
promise学习
定义：promise代表一个异步操作的执行返回状态，这个执行返回状态在promise对象创建时未必已知。它允许你为异步操作的成功或失败指定处理方法。表现：Promise是一种封装未来值的易于复用的异步任务管理机制。术语：1. promise: 指一个拥有符合规范的 then方法的对象；2. thenable: 指一个定义了 then方法的对象；3. 决议（res...原创 2017-11-17 13:14:06 · 421 阅读 · 0 评论 -
node 删除并复制文件
功能：删除dist目录的所有文件夹，并将src目录的文件全部复制到dist目录这里并没有使用异步删除，因为异步删除和异步复制同时进行会有问题。暂时没有很好地解决办法const fs = require('fs');const DIST = './dist'const SRC = './src'//同步删除所有文件const delDir = function(path){ var...原创 2019-09-25 00:36:50 · 213 阅读 · 0 评论 -
gulp打包实现版本控制
//引入gulp和gulp插件//var gulp = require('gulp'),//minifycss = require('gulp-minify-css'),//concat = require('gulp-concat'),// uglify = require('gulp-uglify'),// rename = require('gulp-rename'),// ...原创 2018-06-06 17:21:24 · 743 阅读 · 0 评论 -
Node之从入门到高级入门
概述本文主要利用node搭建服务器，配置路由，处理请求，最终实现了图片上传及在浏览器中展示功能。功能模块index.js 入口文件server.js 服务器搭建routes.js 配置路由requestHandles.js 处理请求架构梳理indes.js作为入口文件，配置不同路由的请求处理函数；并把touter和handler处理函数对象传递给 server...原创 2018-05-17 13:06:23 · 317 阅读 · 0 评论 -
stream学习二
var stream = require('stream')var util = require('util')function ReadStream() { stream.Readable.call(this)}util.inherits(ReadStream,stream.Readable)ReadStream.prototype._read = function () ...原创 2018-04-19 16:51:29 · 154 阅读 · 0 评论 -
stream学习
来源慕课网var Readable = require('stream').Readablevar Writable = require('stream').Writablevar readStream = new Readable()var writStream = new Writable()readStream.push('I')readStream.push('L...原创 2018-04-19 16:41:14 · 173 阅读 · 0 评论 -
node之文件拷贝
var fs = require('fs')var readStream = fs.createReadStream('qd1.mp4')var writeStream = fs.createWriteStream('1-qd1.mp4')readStream.on('data',function (chunk) { if(writeStream.write(chunk) === ...原创 2018-04-19 15:55:40 · 372 阅读 · 0 评论 -
stream
var fs = require('fs')var readStream = fs.createReadStream('logo.png')var n = 0readStream .on('data',function (chunk) { n++ console.log('data emit') console.log(Buffer....原创 2018-04-19 15:46:29 · 152 阅读 · 0 评论 -
node之buffer模块
来自慕课网let fs = require('fs')fs.readFile('logo.png',function (err, origin_buffer) { console.log(Buffer.isBuffer(origin_buffer)) fs.writeFile('logo_buffer.png',origin_buffer,function (er...原创 2018-04-19 15:31:24 · 130 阅读 · 0 评论 -
nodejs-promise实现深度爬虫
代码来源慕课网const http = require('http');const cheerio = require('cheerio');const Promise = require('bluebird')let url = 'http://www.imooc.com/learn/348'let baseUrl = 'http://www.imooc.com/learn/...原创 2018-04-19 11:47:39 · 775 阅读 · 3 评论 -
promise应用一
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-原创 2018-04-19 11:10:29 · 118 阅读 · 0 评论 -
node.js之评论灌水
内容来源慕课网let http = require('https')let querystring = require('querystring')let postData = querystring.stringify({ commentid:'', content: '写的可以啊', replyId:'' })let ...原创 2018-04-18 16:31:08 · 470 阅读 · 0 评论 -
node.js之爬虫实现
数据引用慕课网const http = require('http');const cheerio = require('cheerio');let url = 'http://www.imooc.com/learn/348'function filterChapters(html) { let $ = cheerio.load(html) let chapt...原创 2018-04-18 16:29:54 · 181 阅读 · 0 评论 -
权限统一控制
权限统一控制在很多场景下我们需要做权限控制，通常我们的做法是在场景请求数据时，在每个函数里面去判断是否有权限。但场景如果很多，更改权限控制逻辑时，每个场景的权限控制都要去改动，那样就很不友好了。那我们把权限控制和数据请求分离开，在请求数据前，先判断是否有权限。顺着这个思路，看下面的代码。我们知道es6有个新特性proxy, 它可以实现代理拦截，我们也用es6尝个鲜。es5权限控制<...原创 2019-08-16 22:05:14 · 479 阅读 · 0 评论 -
图片代理预加载
var MyImage = (function () { var imgNode = document.createElement('img') document.getElementById('content').appendChild(imgNode) return function (src) { imgNode.src = src; }})...原创 2018-03-30 10:16:10 · 98 阅读 · 0 评论 -
react 学习地址
React官方文档 React中文文档 React-router v4文档 Redux中文文档 Redux项目1 Redux项目2 管理你的Redux [Redux中文文档2 阮一峰的Redux原创 2018-03-22 14:26:47 · 139 阅读 · 0 评论 -
命令模式
命令模式命令模式最常见的应用场景是：有时需要向某些对象发送请求，但是不知道请求的接受者是谁，也不知道请求的操作是什么。此时希望用一种松耦合的方式设计程序，使得请求发送者和请求接受者能消除彼此之间的耦合关系。 var button1 = document.getElementById('btn1') var button2 = document.getElementById('btn2原创 2017-10-24 14:05:10 · 161 阅读 · 0 评论 -
发布--订阅
定义发布-订阅模式又叫观察者模式，它定义对象间的一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于他的对象都将得到通知。我们一般用事件模型来代替传统的发布订阅模式。 var event = { clientList:[], listen:function (key,fn) { if(!this.clientList[key]){原创 2017-10-23 13:34:26 · 260 阅读 · 0 评论