这份学习链接已经足够了：http://seajs.org/docs/#intro

　　我假设你至少已经浏览过上述链接文档、并且掌握了基本的seajs基础知识~

　　手把手教你创建helloworld~

　　HelloWorld

　　程序员嘛，难免有helloworld情结~

　　平台：win7、chrome

　　① 创建helloworld文件夹

　　② 在helloworld文件夹下，创建index.html、style.css、init.js、data.js、test-export.js、还有一个 lib 文件夹

　　③ 将网上download来的sea.js和jquery-1.10.2.min.js放在由第②步创建的 lib 文件夹中

　　下面来看看我们在上述创建的文件里放入了什咩代码

　　sea.js和jquery-1.10.2.min.js是库文件，理论上不需要我们修改或添加什么，但是这里有一个小细节，因为sea.js专注模块化开发，对于jquery-1.10.2.min.js的库文件引入，我们也需要将jquery-1.10.2.min.js进行模块化，模块化处理很简单——打开jquery-1.10.2.min.js文件，将jquery-1.10.2.min.js所有代码包括在define中，并且返回$.noConflict();

　　jquery-1.10.2.min.js 具体如下：

define(function() {

     //jquery-1.10.2.min.js的源码部分

     return $.noConflict();

});

　　index.html:

<!doctype html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>seajs</title>

	</head>

	<body>

		<div id="content">

			<p class="author"></p>

			<p class="blog"><a href="#">blog</a></p>

		</div>

		<script src="./lib/sea.js"></script>

		<script>

			seajs.use("./init");

		</script>

	</body>

</html>

　　init.js

define(function(require,exports,module) {

	var $ = require('./lib/jquery-1.10.2.min');

	var data = require('./data');

	var css =  require('./style.css');

	var textExport = require('./test-export');

	$('.author').html(data.author);

	$('.blog a').attr('href',data.blog);

	textExport.test();   /在控制台输出hello world

});

　　data.js

define({

	"author": '西红柿炒番茄',

	"blog": 'http://www.cnblogs.com/Iwillknow/'

});

　　style.css

.author {
	color: red;

	font-size: 16px;

}

.blog {

	font-size: 16px;

}

　　test-export.js

define(function(require,exports,module) {

	exports.test = function() {

		console.log("hello wolrd");

	};

});

　　

前端MVC学习——模块发开发、seajs学习的更多相关文章

  1. Flutter开发进阶学习指南Flutter开发进阶学习指南

    Flutter 的起源 Flutter 的诞生其实比较有意思,Flutter 诞生于 Chrome 团队的一场内部实验, 谷歌的前端团队在把前端一些"乱七八糟"的规范去掉后,发现在 ...

  2. 吴裕雄--天生自然Android开发学习：android开发知识学习思维导图

  3. 侃侃前端MVC设计模式

    前言 前端的MVC,近几年一直很火,大家也都纷纷讨论着,于是乎,抽空总结一下这个知识点.看了些文章,结合实践略作总结并发表一下自己的看法. 最初接触MVC是后端Java的MVC架构,用一张图来表示之— ...

  4. Web前端MVC框架的意义分析

    前言: Web前端开发是Web技术发展中的一个重要组成部分,在传统的前端开发中由于外界因素的影响导致其开发形式呈现出简单化的特点,即以页面为主体来展示界面中的信息.然而随着科学技术的不断进步,Web前 ...

  5. 前端MVC学习总结（一）——MVC概要与angular概要、模板与数据绑定

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2. ...

  6. 前端MVC学习总结——AngularJS验证、过滤器

    前端MVC学习总结--AngularJS验证.过滤器 目录 一.验证 二.过滤器 2.1.内置过滤器 2.1.1.在模板中使用过滤器 2.1.2.在脚本中调用过滤函数 2.2.自定义过滤器 三.指令( ...

  7. 前端MVC学习笔记（一）——MVC概要与angular概要、模板与数据绑定

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2. ...

  8. 前端MVC Vue2学习总结（一）——MVC与vue2概要、模板、数据绑定与综合示例

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.Vue是框架而jQuery则是库. 1.2.AMD与CM ...

  9. iOS开发如何学习前端(2)

    iOS开发如何学习前端(2) 上一篇成果如下. 实现的效果如下. 实现了一个横放的<ul>,也既iOS中的UITableView. 实现了当鼠标移动到列表中的某一个<li>,也 ...

随机推荐

  1. 使用Linux系统中的SSH服务

    使用Linux系统中的SSH服务 1.SSH服务应用场景 ① 可以实现对文件的上传与下载 ② 实现远程管理Linux 2.安装SSH服务器 服 务:sshd 位 置:光盘2 软 件:openssh-s ...

  2. wage

    #include<iostream> using namespace std; int main() { double wage1,wage2,time; cout<<&quo ...

  3. Headfirst设计模式的C++实现——策略模式(Strategy)

    前言 最近在学习<Headfirst设计模式>,里面的例子都是Java的.但是我对Java并不熟悉,所以试着用C++来实现书中的例子. 先来看看Duck以及子类 Duck.h #inclu ...

  4. 《LDAP服务器的配置与客户端的测试》RHEL6——第一篇 运维工程师必考

    ldap这种原始的服务器搭建起来比较复杂,同时它也是CE必考的(客户端的搭建). 服务器端的配置: 1.安装openldap-servers软件包 2.查看ldap模板文件的存放位置: 3.拷贝lda ...

  5. 实验九--裸机LCD

    一.环境 系统:ubuntu12.04 开发板:jz2440 编译器:gcc 二.说明 有空补上 三.代码 Makefile: CC = arm-linux-gcc LD = arm-linux-ld ...

  6. 读取iis日志到sql server

    using Fasterflect; using System; using System.Collections.Generic; using System.Data.SqlClient; usin ...

  7. linux服务器修改ssh默认22端口方法

    1.登录服务器,打开sshd_config文件 # vim /etc/ssh/sshd_config 2.找到#Port 22,默认是注释掉的,先把前面的#号去掉,再插入一行设置成你想要的端口号,注意 ...

  8. PHP中include和require绝对路径、相对路径问题

    在写PHP程序时,经常要用到include或require包含其他文件,但是各文件里包含的文件多了之后,就会产生路径问题. 如下目录: <web>(网站根目录) ├<A>文件夹 ...

  9. 关于查看Android系统源码【Written By KillerLegend】

    可能你会想下载Android系统源码,但是我不知道你会看多少系统的源码,如果你对源码只是偶尔看一次的话,推荐你在线看Android的系统源码,下面提供几种查看android系统源码的方法. 1:打开这 ...

  10. 关于SQLite的创建以及使用相关说明

    关于SQLite的创建以及使用相关说明 没有给出具体的程序,但看完这后可能对你有所帮助. 数据库操作基本知识: execSQL(String sql): 执行一个数据库语句 insert(table, ...