导航:首页 > 编程语言 > seajs和jquery

seajs和jquery

发布时间:2023-05-29 14:51:31

① 怎么让sea.js自身异步加载

为了极限性能,也为了做一些封装,我需要对seajs自身进行异步加载,通过以下代码加载seajs发现config与use都未执行。
<script>
// 其他代码

// sea.js 的异步载入代码:
;(function(m, o, d, u, l, a, r) {
if(m[o]) return
function f(n) { return function() { r.push(n, arguments); return a } }
m[o] = a = { args: (r = []), config: f(1), use: f(2), on: f(3) }
m.define = f(0)
u = d.createElement("script")
u.id = o + "node"
u.async = true
u.src = "path/to/sea.js"
l = d.getElementsByTagName("head")[0]
l.appendChild(u)
})(window, "seajs", document);

// 立刻就可以调用 seajs 的方法了:
seajs.config({
alias: {
'jquery': 'path/to/jquery-1.9.1.min.js'
}
});

seajs.use('./main', function(main) {
// do some cool things.
});
</script>

然后在网上查了以下,发现玉伯去除 sea.js 自身的异步加载内置支持,
https://github.com/seajs/seajs/issues/733

木有办法,只能自己改一改了,我当前使用的版本是2.1.1,为了兼容以后新的版本就不动他的源代码,只在sea.js 底部加上一段:
G = this;
var k = G.PagurianObjectName;
var Pagurian = function(a) {

this.push = function(a) {
if (a[0] === 'config') {
seajs[a[0]](a[1]);
}
if (a[0] === "use") {
seajs[a[0]](a[1], a[2]);
}
}
if (a && a.length) {
for (var b = 0; b < a.length; b++) this.push(a[b])
}
};
G[k] = new Pagurian(G[k].q);

然后在用的时候,这样用:
(function(i, d, o, u, p) {
if (i[u]) return;
i['PagurianObjectName'] = p;
i[p] = i[p] || function() {
return (i[p].q = i[p].q || []).push(arguments)
};
s = d.createElement(o);
s.src = "src/core/sea.ext.js";
s.charset = "utf-8";
s.async = true;
s.id = u + "node";
f = d.getElementsByTagName(o)[0];
f.parentNode.insertBefore(s, f);
})(window, document, 'script', "seajs", "pagurian");

pagurian("config", {
base:"src",
alias: {
"jquery": "plugins/jquery/1.11.1/jquery.js"
},
preload: ["jquery"],
charset: 'utf-8',
timeout: 20000,
debug: false
});

pagurian("use", "presenter/standard/standard.app", function(app) {
app.page.message();
});

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

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

③ Seajs的使用

seajs.config
alias
别名配置,配置之后可在模块中使用require调用 require('jquery');

paths
设置路径,方便跨目录调用。通过灵活的设置path可以在不影响base的情况下指定到某个目录。

vars
变量配置。有些场景下,模块路径在运行时才能确定,这时可以使用 vars变量来配置。
vars 配置的是模块标识中的变量值,在模块标识中用 {key}来表示变量。

map
该配置可对模块路径进行映射修改,可用于路径转换、在线调试等。

preload
使用preload配置项,可以在普通模块加载前,提前加载并初始化好指定模块。
注:preload中的空字符串会被忽略掉。

注:preload中的配置,需要等到 use 时才加载。比如:

注:preload 配置不能放在模块文件里面:

debug
值为true时,加载器不会删除动态插入的 script 标签。插件也可以根据debug配置,来决策 log 等信息的输出。

base
Sea.js 在解析顶级标识时,会相对 base 路径来解析。

charset
获取模块文件时,<script> 或 <link> 标签的charset属性。 默认是utf-8
charset还可以是一个函数:

seajs.use
用来在页面中加载一个或多个模块。seajs.use(id, callback?)

注意:seajs.use 与 DOM ready 事件没有任何关系。如果某些操作要确保在 DOM ready 后执行,需要使用 jquery 等类库来保证。比如

注意:use方法第一个参数一定要有,但是可以是null,也可以是一个变量

seajs.cache
通过 seajs.cache,可以查阅当前模块系统中的所有模块信息。
比如,打开 seajs.org,然后在 WebKit Developer Tools 的 Console 面板中输入 seajs.cache,可以看到:

seajs.reslove
类似require.resolve,会利用模块系统的内部机制对传入的字符串参数进行路径解析。

seajs.data
通过 seajs.data,可以查看 seajs 所有配置以及一些内部变量的值,可用于插件开发。当加载遇到问题时,也可用于调试。

④ seajs怎么调用jquery的插件

方法一,将js插件cmd模块化(define封装成seajs模块,返回匿名函数,包含插件的源码)。
/**
* Created with JetBrains PhpStorm.
* User: ph
* Date: 13-3-11
* Time: 上午9:24
* To change this template use File | Settings | File Templates.
*/

define(function(require,exports,moudles){
return function(jquery){
(function($) {
$.fn.pri= function() {
alert($("a").attr("href"))
// 代码区域。
};
})(jquery);
}

})
jquery库在总js文件(调用该插件的文件)中加载。通过require("t1/jquery_pligun")()来传递jquery变量(参数) ,保证了jquery在调用js插件模块之前加载
/**
* Created with JetBrains PhpStorm.
* User: ph
* Date: 13-3-11
* Time: 上午9:40
* To change this template use File | Settings | File Templates.
*/
define(function (require, exports, moudles) {
var $=require("jquery")
require("t1/jquery_pligun")($)
$(document).ready(function () {
$("a").pri()
})

})
补充:SeaJS是一个遵循CommonJS规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制。与jQuery等JavaScript框架不同,SeaJS不会扩展封装语言特性,而只是实现JavaScript的模块化及按模块加载。SeaJS的主要目的是令JavaScript开发模块化并可以轻松愉悦进行加载,将前端工程师从繁重的JavaScript文件及对象依赖处理中解放出来,可以专注于代码本身的逻辑。SeaJS可以与jQuery这类框架完美集成。使用SeaJS可以提高JavaScript代码的可读性和清晰度,解决目前JavaScript编程中普遍存在的依赖关系混乱和代码纠缠等问题,方便代码的编写和维护。

⑤ seajs怎样先加载jquery再加载Bootstrap

seajs加载不符合AMD规范的,要在源代码里加define(function() {//源代码 })

⑥ jquery.1.12.3怎样cmd,让seajs模块化加载呢

直接require引入就可以了。

//别名
alias:{
'jquery':'路径xxx/jquery.1.12.3.min'
},
//需要预加载的js
preload:['jquery']

在seajs的config中增加这个。

⑦ seajs问题加载jquery失败的问题

seajs需要改造jquery,因为原生的jquery没有提供接口给它。建议使用AMD的requireJS。

阅读全文

与seajs和jquery相关的资料

热点内容
网络加载视频失败是怎么回事 浏览:805
传奇账号在哪个文件夹里 浏览:346
百度app在哪里安装 浏览:587
如何设置路由器网络不断网 浏览:471
传到qq群里的文件怎么删除 浏览:861
索尼安卓71更新日志 浏览:234
怎么找手机里的垃圾app 浏览:540
2015蓝桥杯代码填空 浏览:698
安卓数据库dbexecSQL 浏览:227
doc重命名文件格式 浏览:728
getscreen截图工具下载 浏览:719
共识数据是什么时候开始的 浏览:96
数码管显示电压程序 浏览:479
数据库文件有哪个 浏览:543
途强储存在哪个文件夹 浏览:172
如何恢复被覆盖文件 浏览:611
iphone5用哪个版本最好 浏览:327
extjsgrid禁用 浏览:426
如何查找国外论文的编程代码 浏览:366
暗金颜色代码 浏览:789

友情链接