使用seajs来引入js代码
注意的是:引入jquery的代码最好放在html文件中,本文是为了说明seajs中require如何使用的,才将jquery放入seajs中的。
html中对应的代码:
<script type="text/javascript" src="../js/lib/sea.js"></script><!--这里一定要引入sea.js下面才能使用seajs.use()函数-->
<script type="text/javascript">
seajs.use(['../js/zyl'],function(init) {
init();
});
</script>
(注意的是
function(init)中的参数init
)
对应的js代码:
define(function(require, exports, module){
require('./lib/jquery.min');//该模块需要引入的js文件。使用require来引入,这样的好处是需要这些js文件时才引入,而不是一开始就全部放在html中引入
function bindEvents(){ //编写核心函数代码
$('.zuobiaoxi td').click(function() { //前提是html中需要引入jquery
$(this).addClass('td_curr').siblings().removeClass('td_curr').parents().siblings().find('td').removeClass('td_curr');
$(this).find('.round').addClass('curr').parents().siblings().find('.round').removeClass('curr');
});
}
var init = function(){
bindEvents();
}
module.exports = init;
})
这里的
seajs.use(['../js/zyl'],function(init) {
});
就是引入了zyl.js文件,运行zyl.js文件。如果函数中不写init();那么对应的zyl.js文件就要执行init函数()
define(function(require, exports, module){
require('./lib/jquery.min');//该模块需要引入的js文件。使用require来引入,这样的好处是需要这些js文件时才引入,而不是一开始就全部放在html中引入
function bindEvents(){ //编写核心函数代码
$('.zuobiaoxi td').click(function() { //前提是html中需要引入jquery
$(this).addClass('td_curr').siblings().removeClass('td_curr').parents().siblings().find('td').removeClass('td_curr');
$(this).find('.round').addClass('curr').parents().siblings().find('.round').removeClass('curr');
});
}
var init = function(){
bindEvents();
}
init();//这里做了改动
})
此外,还可以在zyl.js中写多个函数,然后使用
module.exports = dialog;来向外提供接口,这样在html中引入的js中就可以直接使用dialog();执行。(如果不写
module.exports = dialog;)则,html中写dialog()不再起作用。
)
则js代码为:
define(function(require, exports, module){
require('./lib/jquery.min.js');
function bindEvents(){ //编写核心函数代码
$('.zuobiaoxi td').click(function() { //前提是html中需要引入jquery
$(this).addClass('td_curr').siblings().removeClass('td_curr').parents().siblings().find('td').removeClass('td_curr');
$(this).find('.round').addClass('curr').parents().siblings().find('.round').removeClass('curr');
});
}
var init = function(){
bindEvents();
}
var dialog=function(){
alert('hello');
}
module.exports = init;
//或者使用init();
module.exports = dialog;
})
对应的html代码为:
<script type="text/javascript" src="../js/lib/sea.js"></script><!--这里一定要引入sea.js下面才能使用seajs.use()函数-->
<script type="text/javascript">
seajs.use(['../js/zyl.js'],function(init) {
init();
dialog();
});
</script>
使用seajs来引入js代码的更多相关文章
- 动态引入js代码
var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = & ...
- 页面中引入js的几种方法
通常大家最为熟悉的是一下两种方法: 在页面中直接写入<script type="text/javascript">js代码</script>. 在页面中引入 ...
- html文件在head标签中引入js地址和直接写js代码,所用时间是不同的,因为引入js地址,文件加载的时候需要通过通讯协议去解析地址,读取外部文件
html文件在head标签中引入js地址和直接写js代码,所用时间是不同的,因为引入js地址,文件加载的时候需要通过通讯协议去解析地址,读取外部文件
- Vue-cli构建项目, 组件中js代码引入图片路径问题
问题描述 .vue的组件分成三个部分, template结构部分, script路径代码, style页面样式 首先, 我们可以在template可以正确引入, 无论是dev, 还是build都没有问 ...
- js代码中引入其他js文件
/***引入 js 文件 @example: import('js/aui.picker.js') @example: import(['js/aui.picker.js', 'css/aui.pic ...
- 浏览器控制台js代码与后台不同步
原因:浏览器会缓存js 如果是将js代码直接通过<script>标签插入jsp页面中则不存在这个问题 在加载页面的时候会重新加载js代码 如果直接将js代码以文件的形式引入,那么每次在修改 ...
- js封装的三级联动菜单(使用时只需要一行js代码)
前言 在实际的项目开发中,我们经常需要三级联动,比如省市区的选择,商品的三级分类的选择等等. 而网上却找不到一个代码完整.功能强大.使用简单的三级联动菜单,大都只是简单的讲了一下实现思路. 下面就给大 ...
- Edge.js:让.NET和Node.js代码比翼齐飞
通过Edge.js项目,你可以在一个进程中同时运行Node.js和.NET代码.在本文中,我将会论述这个项目背后的动机,并描述Edge.js提供的基本机制.随后将探讨一些Edge.js应用场景,它在这 ...
- JS动态引入js,CSS——动态创建script/link/style标签
一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...
随机推荐
- 《JAVA学习笔记 (final关键字)》
[14-9]面向对象-final关键字 /* 继承的弊端,打破封装性. 不让其他类继承该类,就不会有重写. 怎么能实现呢?通过Java中的一个关键子来实现,final(最终化). [final关键字] ...
- hdu 1069
//Accepted 264 KB 0 ms //每种block只有三种方法,且每种放法至多放一次 //规定三条边的顺序后 //把所有的block按x递增排序,x相同则按y递增排序 //然后dp // ...
- (转)在网页中JS函数自动执行常用三种方法
原文:http://blog.sina.com.cn/s/blog_6f6b4c3c0100nxx8.html 在网页中JS函数自动执行常用三种方法 在网页中JS函数自动执行常用三种方法 在HTML中 ...
- 极客DIY:打造属于自己的无线移动渗透测试箱
本文中介绍的工具.技术带有一定的攻击性,请合理合法使用. 你想不想拥有一款属于自己的移动无线渗透测试箱,如果你感兴趣,下面介绍的设备将会对你很有帮助.这个箱子被称为“MiTM(中间人攻击)WiFi箱” ...
- BZOJ 1954 The xor-longest Path
问题转化为一些数里面选两个数异或和最大. #include<iostream> #include<cstdio> #include<cstring> #includ ...
- BZOJ 1816 扑克牌
WA的我怀疑人生.. 发现原来是循环中间就要break掉,不然爆int. 总感觉这题可以直接构造啊.. #include<iostream> #include<cstdio> ...
- Logwatch的配置与使用
Logwatch是使用 Perl 开发的一个日志分析工具 Logwatch能够对Linux 的日志文件进行分析,并自动发送mail给相关处理人员,可定制需求 Logwatch的mail功能是借助宿主系 ...
- utf8与utf-8的区别
相信很多程序员刚开始也会有这样的疑惑,如题,我也是. 其实,他们可以这样来区分. 一.在php和html中设置编码,请尽量统一写成“UTF-8”,这才是标准写法,而utf-8只是在wind ...
- 【题解】【数组】【查找】【Leetcode】Search in Rotated Sorted Array
Suppose a sorted array is rotated at some pivot unknown to you beforehand. (i.e., 0 1 2 4 5 6 7 migh ...
- PostgresSQL 学习资料记录处
PostgresSQL 学习资料记录处 博客:http://francs3.blog.163.com PostgreSQL9.4 中文手册:http://www.postgres.cn/docs/9 ...