分类：JavaScript

2020
09-28

javascript实现的图片预览和上传功能示例【兼容IE 9】

本文实例讲述了javascript实现的图片预览和上传功能。分享给大家供大家参考，具体如下：下载DEMO：https://github.com/CaptainLiao/zujian/tree/master/Upload对于现代浏览器来说，要实现图片预览非常简单：1、fileReader.readAsDataURL(file)2、window.URL.createObjectURL(file)以上两种方法分别可以得到一个base64和一个blob对象的URL地址，从而实现预览。但是，他们只支持在IE10+，显然这是不够的，如何实现低版本IE浏览器的图... 继续阅读 >
2020
09-28

javascript实现移动端 HTML5 图片上传预览和压缩功能示例

javascript实现移动端 HTML5 图片上传预览和压缩功能示例 本文实例讲述了javascript实现移动端HTML5图片上传预览和压缩功能。分享给大家供大家参考，具体如下：在开发移动端web网页中，我们不可避免的会遇到文件上传的功能，但由于手机图片尺寸太大，上传时间过长导致用户体验太差，就需要在上传前对图片进行一定的压缩。在代码之前，有必要先了解我们即将使用到的几个APIfile和FileList对象file对象可以用来获取某个文件的信息,还可以用来读取这个文件的内容.通常情况下,File对象是... 继续阅读 >
2020
09-28

JavaScript变量Dom对象的所有属性

JavaScript变量Dom对象的所有属性 DOM对象的HTML:<button>DisableState</buttom>1,遍历DOM对象所具有的属性（全部，不管是否在HTMLtag中是否设置）<!DOCTYPEhtml><html><body><buttonid="btnToggleState"onclick="toggleStateManagement()">DisableState</button></body><script>varobj=document.getElementById("btnToggleState");vars="";for(vareleminobj){s+=elem+"\n";}alert(s);</script></html>结果：2.遍... 继续阅读 >
2020
09-28

Javascript异步执行不按顺序解决方案

案例分析：比如执行懒加载时候，onscroll事件触发多次事件时候会调用多次ajax回调事件，由于每个事件返回先后次序并不能保证和触发前一致，所以在数据响应返回后所添加的数据顺序就很在push到数组上顺序不一致。例子1：varres=[];functionresponse(data){res.push(data);}//ajax(..)是某个库中提供的某个Ajax函数ajax("http://some.url.1",response);ajax("http://some.url.2",response);这里的并发... 继续阅读 >
2020
09-28

JavaScript自定义超时API代码实例

API是提供给不同语百言的一个接口，也就是对应的函数里面提供了相应的方法。我们只要用js的语法去调用想要的功能就可以。例如度js里面的BOM有screen的方法，他就是浏览器提供给我们的接口，能够对浏览器进行操作。实现一个Ajax请求时回调超时一个函数functiontimeoutify(fn,delay){varintv=setTimeout(function(){//设置超时定时器intv=null;fn(newError("Timeout!"));},delay);returnfunction()... 继续阅读 >
2020
09-28

javascript 模块依赖管理的本质深入详解

本文实例讲述了javascript模块依赖管理的本质。分享给大家供大家参考，具体如下：模块模式定义模块是'javascript'的一种设计模式，它为函数定义一个包装函数，并且该包装函数的返回值与模块的API保持一致：functioncreateModule(){functionhello(name){console.log(name+'帅哥你好!');}return{hello:hello}}//这里调用createModule来创建一个模块实例varfoo=createModule();foo.hello('fayin');单例模块模式... 继续阅读 >
2020
09-28

JavaScript find()方法及返回数据实例

顾名思义就是查找传入的对应数据当数组中的元素在测试条件时返回true时,find()返回符合条件的元素，之后的值不会再调用执行函数。如果没有符合条件的元素返回undefined//定义一个需要被查找的数组varmemoList=[{id:1,name:'1'},{id:2,name:'2'},{id:3,name:'3'}]//用editItem变量将查找出来的数据进行接收vareditItem=memoList.find((ele)=>{... 继续阅读 >
2020
09-28

JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】

本文实例讲述了JavaScript双向链表操作。分享给大家供大家参考，具体如下：一个双向链表(doublylinkedlist)是由一组称为节点的顺序链接记录组成的链接数据结构。每个节点包含两个字段，称为链接，它们是对节点序列中上一个节点和下一个节点的引用开始节点和结束节点的上一个链接和下一个链接分别指向某种终止节点，通常是前哨节点或null，以方便遍历列表。如果只有一个前哨节点，则列表通过前哨节点循环链接。它可以被概念化... 继续阅读 >
2020
09-28

JavaScript console的使用方法实例分析

本文实例讲述了JavaScriptconsole的使用方法。分享给大家供大家参考，具体如下：Console对象提供对浏览器控制台的接入（如：Firefox的WebConsole）。不同浏览器上它的工作方式是不一样的，但这里会介绍一些大都会提供的接口特性。Console对象可以在任何全局对象中访问，如Window，WorkerGlobalScope以及通过属性工作台提供的特殊定义。它被浏览器定义为Window.console，也可被简单的console调用。方法console.log()conso... 继续阅读 >
2020
09-28

JavaScript Date对象功能与用法学习记录

本文实例讲述了JavaScriptDate对象功能与用法。分享给大家供大家参考，具体如下：Date实例用来处理日期和时间。Date对象基于1970年1月1日（世界标准时间）起的毫秒数。JavaScript的Date对象提供了数个UTC时间的方法，也相应提供了当地时间的方法。UTC，也就是我们所说的格林威治时间，指的是time中的世界时间标准。而当地时间则是指执行JavaScript的客户端电脑所设置的时间。Date构造函数newDate();//SunJan06201920:18:0... 继续阅读 >
2020
09-28

JavaScript 链表定义与使用方法示例

本文实例讲述了JavaScript链表定义与使用方法。分享给大家供大家参考，具体如下：链表一个链表是数据元素的线性集合,元素的线性顺序不是由它们在内存中的物理位置给出的。相反,每个元素指向下一个元素。它是由一组节点组成的数据结构,这些节点一起,表示序列。链表的一个缺点是访问时间是线性的(而且难以管道化)。classNode{constructor(val){this.val=val;this.next=null;}}显示链表functiondisplay(){var... 继续阅读 >
2020
09-27

分享一款超好用的JavaScript 打包压缩工具

分享一款超好用的JavaScript 打包压缩工具 背景平时大家在开发Js项目的时候，可能已经离不开webpack等打包工具了。而webpack打包速度大概就是“能用“的水平。大概去年开始，我就开始在构想，如果能写一个极速的打包工具，功能未必需要很强，可能对小项目非常有用。去年我用C++写完parser之后，便没什么动力写下去了。但是最近发现有这个想法的不止我一个，Figma的CTO业余之际写了一个打包器https://github.com/evanw/esbuild，可以说完完全全实现了我想象中... 继续阅读 >
2020
09-27

javascript 使用sleep函数的常见方法详解

本文实例讲述了javascript使用sleep函数的常见方法。分享给大家供大家参考，具体如下：一.什么是sleep函数？花一点时间来聊一下sleep函数，首先什么是sleep函数？sleep是一种函数，他的作用是使程序暂停指定的时间，起到延时的效果。例如：console.log('1');sleep(5000);console.log('2');控制台输出数字1后会间隔5秒后输出数字2当然上面的代码是不能执行的，因为js中是没有sleep方法的。所以这一篇文章主要介绍几种在js中实现sle... 继续阅读 >
2020
09-27

基于JavaScript实现十五拼图代码实例

顾名思义，十五拼图就是将游戏画面中的数字从上到下，从左到右按顺序从1到15排列下来，看起来很简单，但是玩起来不容易。css代码body{font-family:cursive;font-size:14pt;text-align:center;}#puzzlearea{height:400px;margin:0auto;position:relative;width:400px;}.highlight{border-color:red;cursor:pointer;}.puzzletile{background-image:url("../background.jpg");border:5pxsolid... 继续阅读 >
2020
09-27

javascript设计模式 ? 访问者模式原理与用法实例分析

本文实例讲述了javascript设计模式?访问者模式原理与用法。分享给大家供大家参考，具体如下：介绍：访问者模式比较复杂，它包含访问者和被访问元素两个主要组成部分，这些被访问的元素通常具有不同的类型，且不同的访问者可以对他们进行不同的访问操作。访问者模式的主要目的是将数据结构与数据操作相分离。定义：提供一个作用于某对象结构中的个元素的操作表示，它使得可以再不改变各元素的类的前提下定义作用于这些元素的新操... 继续阅读 >