前段时间看到了一个很好看的 HTML5 网站,原网站地址如下:
http://lovelymessag.es/
于是为了学习我就试着将它移植到了我的个人网站上(嘿嘿!请大家不要鄙视啊。为了学习嘛。 :) 保存的功能已经写完了,现在可以与别人分享自己画的大作了!)。
大家也可以参看移植后的地址:
http://ho1ho.com/lovelymessage/
就在移植的过程中,发现了不少的问题。这个网站用到的技术还真不少,移植时着实让我费了好大的劲儿。不过最近经过各种研究,问题还是被我解决了。真是学到了不少东西啊。现将用到的主要技术简要的介绍一下啊:
1. signals.js
官方地址:http://millermedeiros.github.com/js-signals/
简介:signals.js 可以理解成是观察者模式的 JavaScript 版实现。说到这儿,我想大家应该就明白它是干什么的了吧!它的特点是每个事件类型都有它自己的控件器,并且不依赖于观察者。有点类似于在 C# 中使用委托实现的观察者模式。
PS: 有个很不幸的消息必须先告诉你,有关 signals.js 的中文资料基本没有,所以大家要是想了解更多的细节的话,只能看官方文档了啊。
基本用法:(官方示例)
//custom object that dispatch a `started` signal
// myObject 相当于观察者模式中的 Subject
var myObject = {
started : new signals.Signal()
};
// onStarted 相当于观察者模式中的 Observer
function onStarted(param1, param2){
alert(param1 + param2);
}
myObject.started.add(onStarted); //add listener
myObject.started.dispatch('foo', 'bar'); //dispatch signal passing custom parameters
myObject.started.remove(onStarted); //remove a single listener
怎么样,看起来是不是和经典的观察者模式代码很类似。
2. require.js
官方地址:http://requirejs.org/
简介: RequireJS 是一个 JavaScript 文件和模块加载器。可以用于其它 JavaScript 环境,例如 Rhino 或 Node。使用像 RequireJS 这样的模块脚本加载器,可以改进代码的性能和质量。
PS: require.js 的中文资料数量比 signals.js 要稍稍好一些。不过强烈建议看官方的文档。官方文档讲的那个细啊。
基本用法:(官方示例)
前提假设:假设程序目录结构如下:
project-directory/
|-----project.html
|-----scripts/
|-----main.js
|-----require.js
|-----helper/
|-----util.js
<!DOCTYPE html>
<html>
<head>
<title>My Sample Project</title>
<!-- data-main attribute tells require.js to load
scripts/main.js after require.js loads. -->
<script data-main="scripts/main" src="scripts/require.js"></script>
</head>
<body>
<h1>My Sample Project</h1>
</body>
</html>
require(["helper/util"], function(util) {
//This function is called when scripts/helper/util.js is loaded.
//If util.js calls define(), then this function is not fired until
//util's dependencies have loaded, and the util argument will hold
//the module value for "helper/util".
});
分享到:
相关推荐
require.js插件 require.js还提供一系列插件,实现一些特定的功能。 text.js插件的使用
require.js用于模块化管理javascript的管理工具,非常实用
require.jsrequire.jsrequire.jsrequire.jsrequire.jsrequire.js
require.js2.3.5 /** vim: et:ts=4:sw=4:sts=4 * @license RequireJS 2.3.5 Copyright jQuery Foundation and other contributors. * Released under MIT license, ...
本书籍主要讲解了require.js如何使用,以及在使用过程中有哪些容易出问题的地方,适合工作中使用require.js开发的项目
require.js.rar
在非专业前端开发的工作中(比如使用vuejs开发),免不了要进行模块化,js的加载使用require.js就可以了,但是对于.css文件的加载需要使用插件,在试用了github上提供的require.js后发现不太好用(报错,还得改人家...
require.js教程.模块化 大家都知道js代码的面向对象鸡助得没话说 所以将js代码模块化是个很重要的技能 我们使用require.js来将我们写的代码封闭成模块 今天写个教程 requirejs教程,最后自动打包发布js模块文件
将我的博客文章(https://blog.csdn.net/IT_interest/article/details/122973985)中的内容用项目实现出来,功能为:使用webpack中的require.context功能,批量导入本地图片,并且可根据需要支持多格式图片导入。...
基于require.js的Node打包方案
require.js 的沙箱模块 require.Sandbox 是一个沙盒模块,集成到,可用于安全加载模块。 这个想法是将它们包装到一个沙箱中,以确保错误不会使整个应用程序崩溃,但可以以编程方式处理。 沙盒错误 修补错误函数 ...
RequireJS 是一个JavaScript模块加载器。它非常适合在浏览器中使用,但它也可以用在其他脚本环境,就像 Rhino and Node。使用RequireJS加载模块化脚本将提高代码的加载速度和质量。【百度百科】
NULL 博文链接:https://yangyangmyself.iteye.com/blog/2329391
require.js 2.3.5 本来想免费,但是最低分数是2分....................
实现require.js+r.js在node环境下合并,打包,压缩JS代码
Adding require.js to HTML5 boilerplate build
现在,Require.js是我最喜欢的Javascript编程方式。它可以使代码化整为零,并易于管理。而Require.js Optimizer能帮助我们将一个较大的应用分散成多个较小的应用,并通过依赖串联起来,最后在编译打包时合并起来。...
Javascript模块化编程(三)require.js的用法共8页.pdf.zip