一直听说seaJs 和 requireJs 如何如何好的,现在正好手里项目第一版已经做完,学习下模块化js。
HTML代码:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>require - demo</title> 6 <script type="text/javascript" src="js/require.js" data-main = "js/main"></script> 7 </head> 8 <body> 9 10 </body> 11 </html>
引入require.js后,设置 data-main 的值为初始执行的模块(模块既js文件);
main.js
/*入口脚本*/ require.config({ paths: { // -- 配置别名 "jquery":"jquery.min", "init": "init" } }); // 开始逻辑. require(['jquery','init'], function($,exports) { console.dir(exports.callback());// 加载完成回调 });
首先配置require的属性
require 接收2个参数(模块数组,回调);
我们首先加载jquery和初始文件
回调函数内的参数对应模块return的内容;
init.js
define(function() { return { "callback":function(){ var w = $(window); return { "wWidth":w.width(), "wHeight": w.height() } } } });
这样等待init.js文件被加载后就可以输出window的宽和高了
【推荐】FlashTable:表单开发界的极速跑车,让你的开发效率一路狂飙
【推荐】Flutter适配HarmonyOS 5知识地图,实战解析+高频避坑指南
【推荐】博客园的心动:当一群程序员决定开源共建一个真诚相亲平台
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· C#.Net筑基-泛型T & 协变逆变
· dotnet 代码调试方法
· DbContext是如何识别出实体集合的
· 一次 .NET 性能优化之旅:将 GC 压力降低 99%
· MySQL索引完全指南:让你的查询速度飞起来
· .NET中全新的MongoDb ORM框架 - SqlSugar
· 我救了一个网站,性能提升了1500 多倍!
· dotnet 代码调试方法
· .NET程序员的多语言笔记本:Polyglot Notebook
· 别再被 Spring Security 和 Shiro 劝退了!这款国产 Java 权限框架真香!