好久没写日志了
一方面人懒 另一方面新公司只有中午一个半小时可以上网
就抹杀了写日志的兴致。。。
最近做了点自己的事情,写了不少自我感觉还有点用的JS小函数 当然都是基于JQ的
就放出来 大神们给给意见 欢迎各种吐槽
一。提供模板 彻底分离json html js
<script type="text/template" id="template"> <div class="item"> <img src="==img==" width="100%" height="300" alt=""/> </div> </script>
var data = { img : "123.png" }; var _template_str = $("#template"), _str = ""; //返回一个填充好的 html 代码 支持任意的json排列组合 _str = fill_json( data , _template_str ); function fill_json( fill_json , template_str){ var json = fill_json, _str = template_str.split("=="), _len = _str.length, str = {}; for(var i = 0; i < _len; i++){ str[_str[i]] = _str[i]; }; for(var a in str){ if(json[a])str[a] = json[a]; }; _str = []; for(var a in str){ _str.push(str[a]); }; return _str.join(""); };
分离 HTML 和 JS 很早之前就有写过,这个算是改良版 性能上也比之前自己发的有了不少提升
二。代码模块化加载 这个与其说是小函数倒不如说是一中 架构机制
其实对于系统整体的性能提升并没有数量级上的提升 不过对于模块化项目组件的解读上 有着很好的拆分
核心代码:
var input = {}; //存入已导入的 模板 var input_url = { //aaa 简称 "template/aaa.html" 具体的存放地址 aaa : "template/aaa.html", bbb : "template/bbb.html", }; ajax_template( "aaa" , "click"); ajax_template( "bbb" , "hover"); /** * 获取 对应点击的模块 * template_id 每个模块出发的元素id名称 * type触发事件 click hover... **/ function ajax_template( template_id , type ){ var _id = template_id, _type = type; switch( _type ){ case "click": $("#" + _id).unbind("click").click(function(){ x(); }); break; case "hover": $("#" + _id).unbind("hover").hover(function(){ x(); }); break; }; function x(){ if( !input[_id] ){ window.setTimeout(function(){ x(); },100); $.post( input_url[_id] , function(result){ var _result = result; $("body").append(_result); eval(_id + "_start();"); input[_id] = true; }); } else { eval(_id + "_start();"); }; }; },
template/aaa.html 页面:
<script type="text/javascript" id="aaa_js"> function aaa_start(){ var obj = null; var tool = { init : function(){ console.log("加载成功!!"); } }; tool.init(); }; </script>
这个其实很早就运用到自己的项目中了 这几天偶然看到了Dojo的东西 发现这货好像也是这种架构想法
望其项背啊。。。。
写了这么久的JS。。。 发现写得越多 用得越多 这东西就越难
现在就是有种感觉 用JS写RIA就像造房子
JS只是给了你 造砖头的工具
你得先把各种砖头都烧好了 地板用瓷砖 墙壁用红白砖等等
然后在把砖头一块一块的去砌在它应该在的地方 慢慢的一幢房子就这么搭成了
但是 什么地方用什么砖 这个东西还真难去管理
稳定性、高性能、独立模块化、适当的向后兼容。。。
这些东西 都只能凭自己在各个项目中摸爬滚打才能深刻体会它的好与坏
好好学习 天天向上吧。。。。