标签: JavaScript

记录点滴,修炼自己。
0

JavaScript异步编程案例

【转载】阮一峰 Javascript异步编程的4种方法 前言你可能知道,Javascript语言的执行环境是”单线程”(single thread)。 所谓”单线程”,就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。 这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执

0

使用原生js实现元素拖拽功能

前言  本篇仅对拖拽过程中核心几个事件监听的写法进行小结,不涉及页面样式效果的展现。 实现1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818

0

JavaScript的call()、apply()、bind()方法对比总结

前言  JavaScript中的函数其实就是一种对象。函数对象也有自己的很多方法。其中,call()方法和apply()方法就是两个用来间接调用函数的方法。两个方法都允许显式地指明调用时的上下文环境(即this的值)。也就是说,这给我们提供了一种自由—任何函数可以作为任何对象的方法来进行调用。并且,两个方法也都允许显式地指明调用时需要用到的实参。函数经call()或apply()调用后会立即执行

0

jQuery中$.when()方法和deferred对象相关总结

概述jQuery.when( deferreds )1.提供一种方法来执行零个或多个对象的回调函数, Deferred(延迟)对象通常表示异步事件。 2.如果没有参数传递给 jQuery.when(),它会返回一个resolved状态的Promise。 3.如果传递一个非Deferred或Promise对象给jQuery.when(),那么它会被当作是一个被解决(resolved)的延迟对象,并

0

使用JavaScript实现三级联动和实时搜索

前言  本篇仅对三级联动和实时搜索的核心给出说明,对于页面设计、整个工程结构等不做说明。 三级联动根据交互操作异步触发获取第一列数据12345678910111213141516171819202122232425262728293031323334353637383940//异步请求第一列数据-可选指标名称 $.ajax({ type: "POST", async:

0

JavaScript的caller属性和callee属性对比总结

背景  要说这两个方法,必须先说另一个东西—实参对象(arguments)。标识符arguments是指向实参对象的引用。当传入某个函数的参数个数超过函数定义时指定的形参个数时,默认的处理方法是自动忽略多出来的参数。也就是说,默认这不会引起错误。但是这会有另一个问题:无法获取多出来的参数的引用了(无法知道多出来的参数具体值是什么)。这也正是实参对象arguments可以解决的问题。通过argum

0

JavaScript数组方法对比总结

前言  本文对JavaScript中数组类型(Array)的常用方法进行总结,主要包括其API,使用示例和是否直接操作/修改原数组的分析。文章最后会对ECMAScript5中提供的数组方法进行小结。 join()作用  将数组元素衔接为字符串。参数  array.join()  array.join(separator)  separator: 在返回的拼接字符串中,用以连接原来数组元素的分隔

0

使用JavaScript实现轮播图效果(JavaScript运动框架案例)

前言  轮播图组件是一种网站中常见的表现形式。常用于广告位,头条新闻等重要信息的展示而且将图片和信息结合起来,引人注意。轮播图最重要的自然是“轮播”,也就是要让页面中的DOM元素“动”起来。这就自然需要先简单提一下JavaScript的运动框架。 JavaScript运动框架简介  JavaScript运动框架就是指利用js和DOM元素配合,利用js的相关函数以一定的频率操作改变DOM元素的位置

0

Array.prototype.slice.call()的典型应用

作用  一句话来讲,这是一种将类数组对象转换为真正数组的方法。很多时候我们会遇到“类数组对象”,比如在操作DOM元素的时候,查询符合某种class的DOM节点会返回一个NodeList,它就是一个类数组对象。真正数组的很多成员方法不能直接用于类数组对象,因此就需要将其转换为真正的数组。 示例123456789Function.prototype.bind = function(context)

0

JavaScript双向选择器的实现

前言  双向选择器是网站中经常使用的一种组件,适合于要求用户输入固定的一个或多个标签内容的场景,这种格式比普通input输入框的交互方式更加友好,而且可以防止因用户输入的随意性而导致的其他多余工作(比如表单验证)甚至错误。 效果  在说具体细节之前,可以先看一下效果,下图中就实现了一个最基本的双向选择器。 注意事项1.以上组件的编写没有基于原生的CSS,而是引入了AmazeUI框架,利用了

0

《JavaScript权威指南》中文版P204纠错

  中文版《JavaScript权威指南》第六版P204中,讲到使用构造函数定义类时,提到“Range()构造函数是通过new关键字调用的(在示例代码的末尾)”,如下图:   找了半天没看出来示例代码中到底是怎么通过new关键字调用的,于是,查看了一下原书第六版,如下图:   好吧,原来中文版这里出现了一点小错误,直接将前一页P203示例代码“用原型对象定义方法”中的代码粘贴过来了,怪不得

0

JavaScript的null和undefined对比总结

前言  说到这两个类型,首先应该从整体上明确一下JavaScript中提供的数据类型。  JavaScript中的数据类型分为两类:原始类型和对象类型。  其中,原始类型又可以细分为如下5类:数字,字符串,布尔值,null,undefined。  null和undefined都表示一种“空缺”的意思,但具体还有很多细节不同。 null类型检测对null使用typeof检测,可得: 说明  由以

0

《JavaScript 权威指南》P147的一处分析

情景  在《JavaScript权威指南 第六版 中文版》P147,讲到稀疏数组时,书中给出如下的分析和例子:  读完后感觉第一个红框和第二个红框中的表述不是很清楚,有些矛盾。于是在chrome浏览器的控制台进行测试,结果如下: 第一个红框对应结果 第二个红框对应结果 第三个红框对应结果也就是说实测结果与书中第一个红框中的蓝色小框表述相反:0 in a1输出的值是false。 分析  以下

0

JavaScript的闭包案例---2

前言  接续之前的一篇JavaScript的闭包案例—1,加深对《JavaScript权威指南》P187的理解。 描述  使用闭包,可以实现共享私有状态,实现私有存取器属性。本质上就是在同一个作用域链上定义了两个或多个闭包,来共享同样的私有变量。这是十分重要的一种应用,但是要十分小心因为这种做法将那些本不希望共享的变量共享给了其他闭包,这会造成严重的错误并让我们不解。  假设有这样的需求:需要

0

setTimeout与setInterval的对比与互相实现

案例 setTimeout和setInterval对比 另外,根据网上一张关于此问题比较流行的图:1234567function click() { // code block1... setInterval(function() { // process ... }, 200); // code block2 } setInterval可能会存在的问题

0

JavaScript的闭包案例---1

背景  闭包是JavaScript中的一个重要概念。  JavaScript采用词法作用域,函数的执行依赖于变量作用域,这个作用域是在函数定义时决定的,而不是函数调用时决定的。函数对象可以通过作用域链相互关联起来,函数体内部的变量都可以保存在函数作用域内,这就是闭包的特性。

0

使用JavaScript实现数组去重的4种方法及性能比较

方法一思路:创建一个新的结果数组,遍历原数组,利用数组indexOf()方法,判断原数组当前值是否在结果数组中存在,如果存在则跳过,否则压入结果数组。12345678910 function removeDuplicatedItem(ar) { var ret = []; for (var i = 0, j = ar.length; i < j; i++)

0

jQuery的ajax()方法详细分析

前言  ajax,即“Asynchronous Javascript And XML”(异步JavaScript和XML),是一种异步加载数据的Web交互方法,在网页开发中使用十分普遍,实现局部刷新以达到更好的交互效果是ajax的典型应用。 核心  $.ajax(即jQuery.ajax),是jQuery库进行的一次封装。其核心实现是利用了JavaScript中的XMLHttpRequest对

0

使用JavaScript实现非法输入字符实时过滤

前言  表单提交是一项常见操作,对于输入内容的合法性必须在前后端都做验证才能保证可靠性。表单验证有很重要的意义,除了防止注入攻击之类的安全问题外,有时如果不能正确的进行验证,可能会使合法的页面渲染受到影响。比如在实际开发中遇到的一种问题,jsp页面使用JSTL库自定义标签渲染后台传来的数据时,需要将这组数据作为参数传入相应点击事件的回调函数,如果参数中一旦也有双引号”,就会导致解析错误—oncl