JavaScript资料,JavaScript文章,JavaScript文档-易库教程

javascript瀑布流式图片懒加载实例

2017年02月06日 11 阅读

最近项目使用到了“懒加载”，现在更新一般，因为平时主要使移动端的开发所以库文件使用的是zepto.js 。当然也可以和jQuery 通用。代码如下：/** * Created by zhiqiang on 2015/10/14. * hpuhouzhiqiang@gmail.com * 图片的懒加载 **/function loadImgLazy（node） { var lazyNode = $（"[node-type=imglazy]", node）, ...

javascript瀑布流式图片懒加载实例解析与优化

2017年02月06日 11 阅读

之前写过一版图片“懒加载”的文章，刚好周末在整理文件的时候，大概又看了一遍之前写的代码发现有很多可以优化的地方。这篇文章主要就是结合上篇《javascript瀑布流式图片懒加载实例》再来看看图片“懒加载”的一些知识。图片“懒加载”的主旨：按照需要加载图片，也就是说需要显示的时候再加载图片显示，减少一次性加载的网络带宽开销。先来看一段代码： var conf = { "loadfirst": true, "loadimg": true};for （var...

Bootstarp风格的toggle效果分享

2017年02月06日 11 阅读

最近在写项目的时候想要一个这样的效果，我知道这个效果在 flat-ui中有，但是我又不想引用一整个flat-ui; 这个效果依赖html5的transition，所以浏览器兼容成问题；从flat-ui中把这个效果的js和html，以及css给拨离出来；整体的代码如下：运行下面代码<！DOCTYPE html><html><head><meta charset="utf-8"/><title...

理解Javascript图片预加载

2017年02月06日 11 阅读

预加载图片是提高用户体验的一个很好方法。图片预先加载到浏览器中，访问者便可顺利地在你的网站上冲浪，并享受到极快的加载速度。这对图片画廊及图片占据很大比例的网站来说十分有利，它保证了图片快速、无缝地发布，也可帮助用户在浏览你网站内容时获得更好的用户体验。本文将分享三个不同的预加载技术，来增强网站的性能与可用性。方法一：用CSS和JavaScript实现预加载实现预加载图片有很多方法，包括使用CSS、JavaScript及两者的各种组合。这些技术可根据不同设计...

Javascript类型转换的规则实例解析

2017年02月06日 12 阅读

类型转换可以分为隐式转换和显式转换,所谓隐式转换即程序在运行时进行的自动转换,显式转换则是人为的对类型进行强制转换。Javascript的变量是松散类型的，它可以存储Javascript支持的任何数据类型，其变量的类型可以在运行时被动态改变。请看示例：var n = 10;n = "hello CSSer！";n = {};上面的示例中，首先声明n变量并初始化其值为10（整数类型），接着将字符串“hello CSSer！”赋值给n，接着再赋一个对象给它，最...

javascript实现九宫格相加数值相等

2017年02月06日 12 阅读

本文实例介绍了javascript实现九宫格的对应方法，分享给大家供大家参考，具体内容如下实现思路：1、每个格子输入的数值必须为数字；2、输入数值不能重复；3、输入数值不能小于1或大于9；4、数值不能为空；5、相加方式共8个，分别为横向三个、纵向三个、两条对角线两个值。详情如下：解释：以每个格子所标记序号为标识：横向三个值：0-2，3-4，6-8；纵向三个值：[0,3,6]、[1,4,7]、[2,5,8]；对角线两个值：[0,4,8]、[2,4,6...

jquery中键盘事件小结

2017年02月06日 11 阅读

一、首先需要知道的是：1、keydown（）keydown事件会在键盘按下时触发.2、keyup（）keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件3、keypress（）keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键二、获得键盘上对应的ascII码：$（document）.keydown（function（event）{ alert（event.keyCode）; }）; $tips: 上面例子中,event.k...

jQuery中判断对象是否存在的方法汇总

2017年02月06日 11 阅读

如果是下面的 jQuery 代码判断一个对象是否存在，是不能用的。if（$（"#id"））{//...}else{//...}因为 $（“#id”）不管对象是否存在都会返回 object 。正确使用判断对象是否存在应该用：if（$（"#id"）.length>0）{//...}else{//...}使用 jQuery 对象的属性 length 来判断，如果 > 0 就存在。或者if（$（"#id"）[0]）{//...}else{//...}...

JavaScript中的闭包

2017年02月06日 12 阅读

1、什么是闭包闭包，官方对闭包的解释是：一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。简单的说，Javascript允许使用内部函数---即函数定义和函数表达式位于另一个函数的函数体内。而且，这些内部函数可以访问它们所在的外部函数中声明的所有局部变量、参数和声明的其他内部函数。当其中一个这样的内部函数在包含它们的外部函数之外被调用时，就会形成闭包。闭包的特点1 函数嵌套函数2 函数内部可以引用外部的参数...

使用jQuery监听DOM元素大小变化

2017年02月06日 11 阅读

起因今天写页面的时候突然有这么个需求，由于父元素（一个DIV）的height是由javascript计算出来的固定的值，而在其中增加了一个多说插件，在用户评论后，子元素（DIV）的height属性增加，导致子元素溢出。但是又不知道如何为多说的评论按钮增加回调函数，于是乎就想到了根据子元素的大小变化来重新计算父元素的height。onresize?平常，都是在整个浏览器窗口变化时触发一个修改布局的回调函数。使用的是window对象的resize事件，...

JQuery EasyUI的使用

2017年02月06日 11 阅读

jQuery EasyUI 是一个基于 jQuery 的框架，集成了各种用户界面插件。EasyUI 简介easyui是一种基于jQuery的用户界面插件集合。easyui为创建现代化，互动，JavaScript应用程序，提供必要的功能。使用easyui你不需要写很多代码，你只需要通过编写一些简单HTML标记，就可以定义用户界面。easyui是个完美支持HTML5网页的完整框架。easyui节省您网页开发的时间和规模。easyui很简单但功能强大的。本文重点...

jQuery+formdata实现上传进度特效遇到的问题

2017年02月06日 11 阅读

总结我做HTML5文件上传插件遇到的技术问题先贴上源码：fileupload-html5.js（PS:公司使用seajs框架）问题列表1. JQUERY.AJAX没有监听上传进度的ONPROGRESS事件。2. XMLHTTPREQUEST（XHR）跨域问题解答1. JQUERY没有给出ONPROGRESS事件的接口，必须从其他接口中找到原生XHR对象。jQuery.ajax（）返回的是jqXHR对象。jqXHR模仿XHR（原生），但没有模仿实现XHR的所...

浅析jQuery Ajax请求参数和返回数据的处理

2017年02月06日 11 阅读

刚接触学会用jQuery ajax的时候，觉得真东西好神奇，这样就可以把数据取回来了啊。然后我可以把取回来的数据渲染到页面上，一颗赛艇。之前很早接触到项目，并不知道怎么优雅的去用jquery ajax（现在也不优雅）；那个时候看别人写的代码有$.post（"","",...）也有$.get（"","",...）还有$.ajax（）当然现在知道点，这些写法都是一个意思，还是习惯用 $.ajax（）写写吧。之前的数据处理，发送数据请求（json的数据格式），...

JavaScript判断变量是否为数组的方法（Array）

2017年02月06日 11 阅读

今天小编给大家整理些关于javascript判断变量是否是数组（Array）的相关知识，主要通过以下四点给大家展开话题，具体内容如下所示：1. typeof真的那么厉害吗？？//首先看代码var ary = [1,23,4];console.log（typeof ary）; //输出结果是Object上面的办法并不能实时的检测出是否是数组，只能判断其类型，所以说typeof判断基本类型数据还是挺好的，但是不能准确测试出是否是数组（typeof的具体用法以后...

JavaScript中Object.prototype.toString方法的原理

2017年02月06日 11 阅读

在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法.var arr = [];console.log（Object.prototype.toString.call（arr）） //"[object Array]"本文要讲的就是,toString方法是如何做到这一点的,原理是什么.ECMAScript 3在ES3中,Object.prototype.toString方法的规...

JavaScript实现99乘法表及隔行变色实例代码

2017年02月06日 11 阅读

项目需求：实现在页面中输出99乘法表。（要求：以每三行为一组，实现隔行变色（颜色为白，红，黄（也可自己定义）），鼠标滑过每一行，行背景颜色变为蓝色，鼠标离开又恢复原来的颜色），隔行变色的效果需要用if和switch两种判断方式都能实现；额，分析一下实例要求：一个99乘法表，一个多方法的隔行变色，鼠标滑过变另外一个颜色，离开恢复原色。嗯，我们一步步来吧！99乘法表的实现，我相信很多人都知道怎么实现，无非是2个for循环得到的结果，这里我就不多做解释，还不理...

jQuery实现验证年龄简单思路

2017年02月06日 11 阅读

这段代码假定环境是一个ID为age-form的”form”，三个ID分别为”day”，”month”，”year”。$（"#age-form"）.submit（function（）{var day = $（"#day"）.val（）;var month = $（"#month"）.val（）;var year = $（"#year"）.val（）;var age = 18;var mydate = new Date（）;mydate.setFullYear...

JavaScript的设计模式经典之代理模式

2017年02月06日 11 阅读

一、代理模式概念说明：顾名思义就是用一个类来代替另一个类来执行方法功能，这个模式跟装饰模式有点相似，不一样的是，代理模式是代替客户初始化被代理对象类，而装饰模式采用接口或初装饰者参数引用的方式来执行的。解释：房屋中介，可以代理帮助卖家把房子卖给买家，这中间卖家说要卖的价钱就可以了，买家也可以提出自己要买的房型，中介可以帮忙处理中间环节。最后达成买卖。中介可以同时代理很多房屋买卖，并且可以代理租房事宜。二、代理模式的作用和注意事项模式作用：1、远程代理（一个...

JavaScript的设计模式经典之建造者模式

2017年02月06日 11 阅读

一、建造者模式模式概念建造者模式可以将一个复杂的对象的构建与其表示相分离，使得同样的构建过程可以创建不同的表示。也就是说如果我们用了建造者模式，那么用户就需要指定需要建造的类型就可以得到它们，而具体建造的过程和细节就不需要知道了。建造者模式实际就是一个指挥者，一个建造者，一个使用指挥者调用具体建造者工作得出结果的客户。建造者模式主要用于“分步骤构建一个复杂的对象”，在这其中“分步骤”是一个稳定的算法，而复杂对象的各个部分则经常变化。通俗的说：就是一个白富美...

JavaScript设计模式经典之工厂模式

2017年02月06日 11 阅读

一、工厂模式概念工厂模式定义一个用于创建对象的接口，这个接口由子类决定实例化哪一个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型（抽象工厂）。这个模式十分有用，尤其是创建对象的流程赋值的时候，比如依赖于很多设置文件等。并且，你会经常在程序里看到工厂方法，用于让子类定义需要创建的对象类型。二、工厂模式的作用和注意事项模式作用：1、对象构建十分复杂--我们穿鞋很简单，但是制作鞋子的过程十分复杂2、需要依赖具体的环...

首页 / 脚本样式 / JavaScript

javascript瀑布流式图片懒加载实例

javascript瀑布流式图片懒加载实例解析与优化

Bootstarp风格的toggle效果分享

理解Javascript图片预加载

Javascript类型转换的规则实例解析

javascript实现九宫格相加数值相等

jquery中键盘事件小结

jQuery中判断对象是否存在的方法汇总

JavaScript中的闭包

使用jQuery监听DOM元素大小变化

JQuery EasyUI的使用

jQuery+formdata实现上传进度特效遇到的问题

浅析jQuery Ajax请求参数和返回数据的处理

JavaScript判断变量是否为数组的方法（Array）

JavaScript中Object.prototype.toString方法的原理

JavaScript实现99乘法表及隔行变色实例代码

jQuery实现验证年龄简单思路

JavaScript的设计模式经典之代理模式

JavaScript的设计模式经典之建造者模式

JavaScript设计模式经典之工厂模式