javascript模块,javascript模块化开发

如何用javascript实现模块的拖动?

1、拖动层：

div id="div1" style="position:absolute; background-color:#0064c2; width:150px; height:150px;" onmousedown="MoveStart(this,event)"/div

script

function MoveStart(o,event){

var oX = event.clientX-o.offsetLeft;

var oY = event.clientY-o.offsetTop;

document.attachEvent("onmousemove",MoveIt);

document.attachEvent("onmouseup",MoveStop);

event.cancelBubble = true;

event.returnValue = false;

function MoveIt(e){

e = window.event;

o.style.left = (e.clientX-oX)+'px';

o.style.top = (e.clientY-oY)+'px';

event.cancelBubble = true;

}

function MoveStop(){

document.detachEvent("onmouseup",MoveStop);

document.detachEvent("onmousemove",MoveIt);

}

event.cancelBubble = true;

}

/script

2、关掉浏览器，拖动以后的层还可以留在拖动后的位置。

只需要在用户退出时，记录层的当前位置，存储于数据库中，下次用户再打开此页面时，从数据库中读取层的位置再显示。

相关问答

Q1: 如何运用javascript引入HTML，在网页中插入模块

在JS中插入短的HTML代码，可以通过先使用一个函数来包着，你要添加的HTMl代码，然后在使用innerHTML这个函数提取就行，在你的HTMl中添加一个事件就行，然后调用这个函数就行了，具体的我提供例子给你看下：

Q2: javascript模块化是什么?优缺点有哪些？

可维护性

灵活架构，焦点分离

方便模块间组合、分解

方便单个模块功能调试、升级

多人协作互不干扰

可测试性，可分单元测试；

性能损耗

系统分层，调用链会很长

模块间通信,模块间发送消息会很耗性能

最近的项目中也有用到模块化；

使用的是seajs,但是当引用到jquery,jquery easyui/或者jquery；

UI组件时,有可能会用到很多jquery插件，那这样要是实现一个很复杂的交互时，模块间的依赖会很多，使用define（）方法引入模块会很多。

Q3: 页面中有多个javascript模块要响应document.body.onmouseup事件，怎么使它们互不干扰？

用添加事件

function addEvent(obj, eventName, handler, argsObject)

{

var eventHandler = handler;

if(argsObject)

{

eventHander = function(e)

{

handler.call(argsObject, e);

}

}

if(window.attachEvent)

obj.attachEvent("on" + eventName, eventHandler );

else

obj.addEventListener(eventName, eventHandler, false);

}

function removeEvent( obj, eventName, handler, cap)

{

var cap = cap || false;

if(window.detachEvent)

obj.detachEvent("on"+eventName, handler)

else

obj.removeEventListener(eventName, handler, cap);

}

这样onmouseover就有多个动作了

Q4: javascript模块化是什么及其优缺点介绍

如今backbone、emberjs、spinejs、batmanjs

等MVC框架侵袭而来。CommonJS、AMD、NodeJS、RequireJS、SeaJS、curljs等模块化的JavaScript扑面而

来。web前端已经演变成大前端，web前端的发展速度之快。

1)我们来看看什么是模块化？

模块化是一种将系统分离成独立功能部分的方法，可将系统分割成独立的功能部分，严格定义模块接口、模块间具有透明性。javascript中的模块在一些C、PHP、java中比较常见:

c中使用include 包含.h文件;php中使用require_once包含.php文件

java使用import导入包

此中都有模块化的思想。

2)模块化的优缺点：

a优点：

可维护性

1.灵活架构，焦点分离

2.方便模块间组合、分解

3.方便单个模块功能调试、升级

4.多人协作互不干扰

可测试性

1.可分单元测试

b缺点：

性能损耗

1.系统分层，调用链会很长

2.模块间通信,模块间发送消息会很耗性能

3)最近的项目中也有用到模块化，

使用的是seajs,但是当引用到jquery,jquery easyui/或者jquery

UI组件时,有可能会用到很多jquery插件，那这样要是实现一个很复杂的交互时，模块间的依赖会很多，使用define（）方法引入模块会很多，不知

有么有什么好的方法？

4)附：

内聚度

内聚度指模块内部实现，它是信息隐藏和局部化概念的自然扩展，它标志着一个模块内部各成分彼此结合的紧密程度。好处也很明显，当把相关的任务分组后去阅读就容易多了。 设计时应该尽可能的提高模块内聚度，从而获得较高的模块独立性。

耦合度

耦合度则是指模块之间的关联程度的度量。耦合度取决于模块之间接口的复杂性，进入或调用模块的位置等。与内聚度相反，在设计时应尽量追求松散耦合的系统。