Warren

不积跬步,无以至千里

  • 2013-06-07 18:20:43.0月
  • 2013-06-07 18:20:43.0

分类:JavaScript / 标签:js,javascript,前端,继承,拖拽

继承,其可以最大限度的重用代码,在较大的项目中,可以使代码更具可读性,并且易维护。

下面就来整理一下,js中继承是如何实现的:

拿一个拖拽的小例子来说,代码如下:

......

2013-06-07 18:20:43.0 / 全文阅读
  • 2013-06-07 08:23:02.0月
  • 2013-06-07 08:23:02.0

分类:JavaScript / 标签:js,前端,判断相等

判断两个变量是否相等是程序设计中非常重要的运算。在处理原始值时,这种运算相当简单,但涉及对象,任务就稍有点复杂。

ECMAScript 提供了两套等性运算符:等号和非等号用于处理原始值,全等号和非全等号用于处理对象。

......

2013-06-07 08:23:02.0 / 全文阅读
  • 2013-06-06 18:28:32.0月
  • 2013-06-06 18:28:32.0

分类:JavaScript / 标签:js,javascript,前端,面向对象,原型,prototype

面向对象编程(OOP)的特点

抽象:抓住核心问题

封装:不考虑内部实现,只考虑功能使用

继承:从已有对象上,继承出新的对象

对象的组成

方法——函数:过程、动态的

属性——变量:状态、静态的

工厂方式

什么是原型——prototype?

Json方式的面向对象

命名空间

......


2013-06-06 18:28:32.0 / 全文阅读
  • 2013-06-01 21:12:21.0月
  • 2013-06-01 21:12:21.0

分类:JavaScript / 标签:js,javascript,drag,前端

拖拽原理:

与鼠标保持距离不变,并设置onmousedown,onmousemove,onmouseup三个事件方法。

拖拽框架:

var oDiv=document.getElementById('div1');	
	var disX=0;
	var disY=0;	
	oDiv.onmousedown=function (ev)
	{
		var oEvent=ev||event;
		
		disX=oEvent.clientX-oDiv.offsetLeft;
		disY=oEvent.clientY-oDiv.offsetTop;
		
		document.onmousemove=function (ev)
		{
			var oEvent=ev||event;
			var l=oEvent.clientX-disX;
			var t=oEvent.clientY-disY;
			
			oDiv.style.left=l+'px';
			oDiv.style.top=t+'px';
		};
		
		document.onmouseup=function ()
		{
			document.onmousemove=null;
			document.onmouseup=null;
		};
		
		return false;	//chrome、ff、IE9
	};

......

2013-06-01 21:12:21.0 / 全文阅读
  • 2013-05-27 21:44:21.0月
  • 2013-05-27 21:44:21.0

分类:JavaScript / 标签:javascript,js,前端

js运动的应用真是随处可见,例如图片切换等效果都离不开js运动效果的实现,所以有必要把可以重用的代码封装起来以方便调用,这便称之为运动框架。

整理出js运动框架的代码如下,move.js:

......

2013-05-27 21:44:21.0 / 全文阅读
分享按钮