随笔分类 - javascript
摘要：从 prototype.js 深入学习 javascript 的面向对象特性js是一门很强大的语言，灵活，方便。 目前我接触到的语言当中，从语法角度上讲，只有 Ruby 比它更爽。不过我接触的动态语言只有： js ruby python flash的as 简单的几门， 应该算是井底之蛙之见。js 语法成分简单，没有 ruby 语言复杂。所以有时候我觉得她更干净（Ruby Fans 不要攻击我哦，我也是很爱很爱很爱Ruby的）！prototype.js 无疑是 js的漂亮之作，从它身上应该可以学到一些东西。如果你用 js 在页面仅仅能写出 if, alert等简单的验证代码，或者想多了解一下Js
阅读全文
摘要：少说话，多干事，FIRE!!!!!开始创建对象： 1.对象字面量。var clock={hour:12,minute:10,second:10,showTime:function(){alert(this.hour+":"+this.minute+":"+this.second);}}clock.showTime();//调用2.创建Object实例var clock = new Object();clock.hour=12;clock.minute=10;clock.showHour=function(){alert(clock.hour);};clo
阅读全文
摘要：类变量/类方法/实例变量/实例方法先补充一下以前写过的方法:在javascript中,所有的方法都有一个call方法和apply方法.这两个方法可以模拟对象调用方法.它的第一个参数是对象,后面的参数表示对象调用这个方法时的参数(ECMAScript specifies two methods that are defined for all functions, call()and apply(). These methods allow you to invoke a function as if it were a method of some other object. The firs
阅读全文
摘要：前言JavaScript 不包含传统的类继承模型，而是使用 prototypal 原型模型。虽然这经常被当作是 JavaScript 的缺点被提及，其实基于原型的继承模型比传统的类继承还要强大。实现传统的类继承模型是很简单，但是实现 JavaScript 中的原型继承则要困难的多。由于 JavaScript 是唯一一个被广泛使用的基于原型继承的语言，所以理解两种继承模式的差异是需要一定时间的，今天我们就来了解一下原型和原型链。原型10年前，我刚学习JavaScript的时候，一般都是用如下方式来写代码： var decimalDigits = 2, tax ...
阅读全文
摘要：function ClassA(sColor) { this.color = sColor; this.sayColor = function () { alert(this.color); };}function ClassB(sColor, sName) { this.newMethod = ClassA; this.newMethod(sColor); delete this.newMethod; this.name = sName; this.sayName = function () { alert(this...
阅读全文
摘要：由于JavaScript的灵活性,可以让每个人按照自己的习惯进行编写代码.有函数式的编程方式,也有现在用的较为广泛的对象字面量.由于面向对象的出现,JavaScript刚开始的函数编程也逐渐演化为类式编程方式.现在我对几种比较熟悉的编程习惯进行简单的说明:1.对象字面量:var person = { name:null, setName:function(name){ this.name = name; return this.name; }, getName:function(){ alert(this.name); }...
阅读全文
摘要：序 昨天写了篇通过jQuery源码学习javascript（一），里面有一个定义对象C的方法，我早期也没有太注意这个方面的技术细节。后来我查了一下资料，发现里面有很多巧的地方。今天与大家分享。巧妙1：函数 在javascript代码中函数是个不可多得的人才。 ♥它可以归置代码段，封装相对独立的功能。 ♥它也可以实现类，注入ＯＯＰ思想。 jQuery就是一个函数，你也可以把它当成类（呵呵，本身就是类）。 (function(){ var jQuery = function() { // 函数体 } window.jQuery = wind...
阅读全文
摘要：http://www.16sucai.com/uploadfile/show2013/0402002/$(function(){ $('.passcard').hover(function(){ $(this).stop(false,false).animate({'margin-bottom':'-100px'},400) },function(){ $(this).stop(false,false).animate({'margin-bottom':'-320px'},400) }) })jquery页面样式切
阅读全文
摘要：Html<!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> <title>simple js dialog demo</title> <style type="text/cs
阅读全文
摘要：今天浏览jQuery的deprecated列表，发现live()和die()在里面了，赶紧看了一下，发现从jQuery1.7开始，jQuery引入了全新的事件绑定机制，on()和off()两个函数统一处理事件绑定。因为在此之前有bind(), live(), delegate()等方法来处理事件绑定，jQuery从性能优化以及方式统一方面考虑决定推出新的函数来统一事件绑定方法并且替换掉以前的方法。on(events,[selector],[data],fn)events:一个或多个用空格分隔的事件类型和可选的命名空间，如"click"或"keydown.myPlu
阅读全文
摘要：使用console.log()打印出jquery选择器返回的对象，发现它永远是一个数组对象，若未找到指定元素，就会返回一个空的数组对象。通常，我们用js判断dom是否存在，直接使用：if( document.getElementById("wrap") )就能判断，但是如果是jquery就不能这样用了：if( jQuery('wrap') )因为jquery选择器返回的永远是一个数组对象，若未找到指定元素，就会返回一个空的数组对象，不是boolean型：if( jQuery('wrap').length > 0 )
阅读全文
摘要：http://gbin1.com/gb/demoviewer/360/06242ba0-40a1-45fd-946f-cc89e0df64c9/index.html.htm相信做设计的朋友肯定都知道dribbble.com，它是一个非常棒的设计师分享作品的网站，全世界数以万计的设计高手和行家都在这个网站上分享自己的作品，当然，如果你常在上面闲逛的话，经常得到一些免费的好东西。在今天的这篇jQuery教程中，我们将使用jQuery的几个插件来开发一个响应式的瀑布流应用，这个应用可以帮助你实时的从dribbble上得到最流行的设计作品，我们将使用如下几个插件：isotope ： 一个魔术布局插件，
阅读全文
摘要：在jQuery的开发过程中，我们往往需要处理各种事件，例如，click()，hover()等。在jQuery的API中，我们可以使用不同的方法来将这些事件绑定到特定的元素中。今天这篇文章中，我们将要介绍如何使用bind()，on()，live()和delegate()方法来绑定特定的事件，什么情况下使用，什么情况下不适用它们。希望能够帮助大家更好的了解和使用jQuery的时间处理方法。如果你喜欢我们的文章，请给我们留言，谢谢！bind()方法使用较早版本jQuery的教程或者应用中，我们往往使用bind()方法来将事件绑定到特定的元素上，如下：<section id="cont
阅读全文
摘要：虚线框简直就是个多余的东西，上一篇教大家怎么去除Firefox中链接和按钮虚线框，今天叫大家去掉去除IE中链接的虚线框。方法一：利用javascript的onfocus事件，实现如下：Html代码<ahref="http://www.hujuntao.com/"onfocus="this.blur();">设计蜂巢</a>如果引入了jQuery框架则可以利用它的事件绑定机制：Js代码$('a').bind('focus',function(){if(this.blur){//如果支持 this.bl
阅读全文
摘要：1、$.extend()为jQuery添加扩展方法和属性，用一个或多个多想扩展另一个对象，并返回已修改的原始对象；语法：$.extend({object1},{object2},{object3},{object4});把object2，object3，object4的对象中的属性和方法合并（重构）到object1对象中，后面参数的键值与前面的相同的话，合并（重构）后以后面的为主；//（1）多个参数对象 var parameObj = { "province": "山东", "city": "济南" }; //实例
阅读全文
摘要：jquery插件丰富，很多都是很好用的，最近学习了一下如何制作jquery插件，发现jquery插件制作其实很简单，这里介绍一下。jquery插件的基本格式：(function($){ $.fn.tab = function(options){//$.fn后面的tab是这个插件的函数名称。可以更具自己喜好进行修改 var defaults = { //相关属性设置 } var options = $.extend(defaults, options); this.each(function(){ //实现的功能设置 }); };})(jQuery);我...
阅读全文
摘要：Jquery中：1. $是Jquery的简写形式，所以，Jquey()和$()的意思是一样的；所有用$()的地方，$都可以用Jquery代替；2. 因为不能假定$在任何环境中都是有效的，所以，插件中一般用Jquery定义，而不用$定义；、3. 用Jquery.extend增加的函数，或者说扩展的函数，可以理解成添加类方法——用类名调用4. 用Jquery.fn.extend增加的函数，或者说扩展的函数，可以理解成添加对象方法，即添加成员函数，用对象名调用5. Jquery.fn=Jquery.prototype，所以，Jquery.fn是Jquery.prototype的别名；6. 那么Jqu
阅读全文
摘要：Jquery为开发插件提供了两个方法，分别是：$.extend(obj);$.fn.extend(obj);1.那么这两个分别是什么意思？$.extend(obj);是为了扩展jquery本身，为类添加新的方法$.fn.extend(obj);给JQUERY对象添加方法。2.$.fn中的fn是什么意思，其实是prototype，即$.fn=$.protoytpe;具体用法请看下面的例子：$.extend({add:function(a,b){returna+b;}})$.add(5,8)//return13注意没有，这边的调用直接调用，前面不用任何对象。直接$.+方法名$.fn.extend(
阅读全文
摘要：1.javascript的变量是无类型的（untype）。2.用var声明的变量是永久性的。所以当你试图用delete来删除其声明的变量时会报错。3.当试图读取一个未声明的变量时，会报错。4.当给一个未用var声明的变量赋值时，js会隐式的声明该变量（这个变量会被声明为全局变量，所以最好用var来声明。这一点在局部声明时非常重要）。5.在函数内部，局部变量的优先级要高于同名的全局变量（相当于隐藏了该同名的全局变量）。结合4，5两点。我们给出一个列子来说明其重要性。var part = "global"; //声明一个全局变量function checkpart(){var
阅读全文
摘要：在写这篇文章之前，曾经写过一篇关于AJAX技术的随笔，不过涉及到的方面很窄，对AJAX技术的背景、原理、优缺点等各个方面都很少涉及null。这次写这篇文章的背景是因为公司需要对内部程序员做一个培训。项目经理找到了我，并且征询我培训的主题，考虑到之前Javascript、CSS等WEB开发技术都已经讲解过了，所以决定针对AJAX这一块做一个比较系统的培训，所以这篇文章实际上是一个培训的材料。AJAX技术的背景不可否认，ajax技术的流行得益于google的大力推广，正是由于google earth、google suggest以及gmail等对ajax技术的广泛应用，催生了ajax的流行。而这也
阅读全文