<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="demo1">this is a demo.</div>
<div id="demo2">this is a demo.</div>
<div id="demo3">this is a demo.</div>
<script type="text/javascript">
/**
* [MYAPP description]
* @type {[type]}
*/
var MYAPP=MYAPP || {};
MYAPP.namespace=function(ns_string){
var parts=ns_string.split("."),
parent=MYAPP,
i;
if (parts[0]==="MYAPP") {
parts=parts.slice(1);
}
for(i=0;i<parts.length;i++){
if (typeof parent[parts[i]]==="undefined") {
parent[parts[i]]={};
}
parent=parent[parts[i]];
}
return parent;
} MYAPP.namespace("MYAPP.DOM");
MYAPP.namespace("MYAPP.COR");
MYAPP.COR={
extend:function(Child,Source){
var i;
for(i in Source){
Child[i]=Source[i];
}
return Child;
}
}
MYAPP.DOM.dome=(function(){
function Dome(els){
var i;
for(var i=0;i<els.length;i++){
this[i]=els[i];
}
this.length=els.length;
}
MYAPP.COR.extend(Dome.prototype,(function(){
if (typeof Array.prototype.indexOf !=="function") {
Array.prototype.indexOf=function(item){
var i;
for(i=0;i<this.length;i++){
if (this[i]===item) {
return i;
}
}
return -1;
}
}
return {
map:function(fun){
var results=[],i;
for(i=0;i<this.length;i++){
results.push(fun.call(this,this[i],i));
}
return results;
},
forEach:function(fun){
this.map(fun);
return this;
},
mapOne:function(fun){
var len=this.map(fun);
return len.length > 1 ? len : len[0];
},
text:function(text){
if (typeof text !=="undefined") {
return this.forEach(function(el){
el.innerHTML=text;
})
}else{
return this.mapOne(function(el){
return el.innerText;
})
}
},
html:function(html){
if (typeof html !=="undefined") {
return this.forEach(function(el){
return el.innerHTML=html;
})
}else{
return this.mapOne(function(el){
return el.innHTML;
})
}
},
addClass:function(classes){
var className=" ",i;
if (typeof classes !=="string") {
for(i=0;i<classes.length;i++){
className+=classes[i];
}
}else{
className+=classes;
}
return this.forEach(function(el){
el.className+=className;
})
},
removeClass:function(clazz){
return this.forEach(function(el){
var cs=el.className.split(" "),i;
while ((i=cs.indexOf(clazz))>-1) {
cs=cs.slice(0,i).concat(cs.slice(++i));
};
el.className=cs.join(" ");
})
},
attr:function(attr,val){
if (typeof val !=="undefined") {
return this.forEach(function(el){
el.setAttribute(attr,val);
})
}else{
return this.mapOne(function(el){
return el.getAttribute(attr);
})
}
},
append:function(els){
return this.forEach(function (parEl, i) {
(function(){
els.forEach(function(childEl){
var childEl=childEl.cloneNode(true);
parEl.appendChild(childEl);
})
})()
});
},
prepend:function(els){
return this.forEach(function(parEl,i){
(function(){
els.forEach(function(childEl){
var childEl=childEl.cloneNode(true);
parEl.insertBefore(childEl,parEl.firstChild);
})
})()
})
},
remove:function(){
return this.forEach(function(el){
return el.parentNode.removeChild(el);
})
},
on:(function(){
if (document.addEventListener) {
return function(evt,fn){
return this.forEach(function(el){
el.addEventListener(evt,fn,false);
})
}
}else if(document.attachEvent){
return function(evt,fn){
return this.forEach(function(el){
el.attachEvent("on"+evt,fn);
})
}
}else{
return function(evt,fn){
return this.forEach(function(el){
el["on"+evt]=fn;
});
}
}
}()),
off:function(){
if (document.removeEventListener) {
return function(evt,fn){
return this.forEach(function(el){
el.removeEventListener(evt,fn,false);
})
}
}else if(document.detachEvent){
return function(evt,fn){
return this.forEach(function(el){
el.detachEvent(evt,fn,false);
})
}
}else{
return function(evt,fn){
return this.forEach(function(el){
el["on"+evt]=null;
})
}
}
}
}
}()))
return {
get:function(selector){
var els;
if (typeof selector ==="string") {
els=document.querySelectorAll(selector);
}else if(selector.length){
els=selector;
}else{
els=[selector];
}
return new Dome(els);
},
create:function(tagName,attrs){
var el=new Dome([document.createElement(tagName)]);
if (attrs) {
if (attrs.className) {
el.addClass(attrs.className);
delete attrs.className;
}
if (attrs.text) {
el.text(attrs.text);
delete attrs.text;
}
for(var key in attrs){
if (attrs.hasOwnProperty(key)) {
el.attr(key,attrs[key]);
}
}
}
return el;
}
}
}())
MYAPP.DOM.whenReady=(function(){
var funcs=[],ready=false;
var handler=function(e){
if (ready) {
return null;
}
if (e.type==="readystatechange" && document.readyState!=="complete") {
return null;
}
for(var i=0;i<funcs.length;i++){
funcs[i].call(document);
}
ready=true;
funcs=null;
}
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded",handler,false);
document.addEventListener("readystatechange",handler,false);
window.addEventListener("load", handler, false);
}else if(document.attachEvent){
document.attachEvent("onreadystatechange",handler);
window.attachEvent("onload",handler);
}
return function whenReady(f){
if(ready){
f.call(document);
}else{
funcs.push(f);
}
}
}())
// MYAPP.DOM.whenReady(function(){
// var demo=MYAPP.DOM.dome.get("#demo1,#demo2,#demo3");
// var e=MYAPP.DOM.dome.create("div",{className:"3",text:"333"});
// demo.prepend(e);
// })
</script>
</body>
</html>

结合之前看的一些js书籍以及blog和一些js框架源码 最近总结了一下,花点时间完善了一下之前写的js小库,继续完善之中

javascript library的更多相关文章

  1. A javascript library providing cross-browser, cross-site messaging/method invocation. http://easyxdm.net

    easyXDM - easy Cross-Domain Messaging easyXDM is a Javascript library that enables you as a develope ...

  2. Dynamices CRM JS 类库 神器 XrmServiceToolkit - A Microsoft Dynamics CRM 2011 & CRM 2013 JavaScript Library

    XrmServiceToolkit - A Microsoft Dynamics CRM 2011 & CRM 2013 JavaScript Library http://xrmservic ...

  3. Raphaël—JavaScript Library

    Raphaël-JavaScript Library What is it? Raphaël is a small JavaScript library that should simplify yo ...

  4. a Javascript library for training Deep Learning models

    w强化算法和数学,来迎接机器学习.神经网络. http://cs.stanford.edu/people/karpathy/convnetjs/ ConvNetJS is a Javascript l ...

  5. JavaScript 工具库:Cloudgamer JavaScript Library v0.1 发布

    JavaScript 工具库:Cloudgamer JavaScript Library v0.1 发布   研究了一年多的js,也差不多写一个自己的js库了.我写这个不算框架,只是一个小型的js工具 ...

  6. jQuery JavaScript Library v3.2.1

    /*! * jQuery JavaScript Library v3.2.1 * https://jquery.com/ * * Includes Sizzle.js * https://sizzle ...

  7. A JavaScript library for reading EXIF meta data from image files.

    exif-js/exif-js: JavaScript library for reading EXIF image metadata https://github.com/exif-js/exif- ...

  8. 转:Build Your First JavaScript Library

    http://net.tutsplus.com/tutorials/javascript-ajax/build-your-first-javascript-library/ Step 1: Creat ...

  9. [React] 01 - Intro: javaScript library for building user interfaces

    教学视频: http://www.php.cn/code/8217.html React 教程: http://www.runoob.com/react/react-tutorial.html 本篇是 ...

随机推荐

  1. Mysql 导出数据库和指定表中的数据

    参考地址:http://jingyan.baidu.com/article/b7001fe14240ab0e7282dde9.html [root@youo zw]# mysqldump -u roo ...

  2. Asp.net开启分布式事务管理

    1.确保服务器分布式管理服务 Distributed Transcation Coordinator 有开启 2.使用分布式事务代码的项目中添加System.Transactions程序集的引用 3. ...

  3. 6、android开发中遇到的bug整理

    1.使用actionProvider时出现的问题 bug复现: 解决方案: //import android.support.v4.view.ActionProvider; import androi ...

  4. 浅谈KL散度

    一.第一种理解 相对熵(relative entropy)又称为KL散度(Kullback–Leibler divergence,简称KLD),信息散度(information divergence) ...

  5. 2015 WEB前端学习路线图

    2015 WEB前端学习路线图,欢迎小伙伴补充 @落雨

  6. 【转载】Redis与Memcached的区别

    传统MySQL+ Memcached架构遇到的问题 实际MySQL是适合进行海量数据存储的,通过Memcached将热点数据加载到cache,加速访问,很多公司都曾经使用过这样的架构,但随着业务数据量 ...

  7. css之margin && padding讲解

    margin && padding盒子模型: margin是模块与模块的空隙,padding是内容与边框的空隙 注: 1.margin:边缘.空白 2.padding:填充 margi ...

  8. ObjectStore onFetch方法获取记录总数

    转自:http://blog.csdn.net/earthhour/article/details/38686029 ObjectStore onFetch方法获取记录总数 require(['doj ...

  9. mysql if条件

    #if表达式 SELECT reg_no, IF(reg_no='718170554','黄色宾利','红色宾利') FROM car WHERE reg_no IN ('718170554','12 ...

  10. 13test06:花朵数

    #include<iostream> using namespace std; #define N a//定义宏时后面不加:否则会把':'一起定义为宏. int getP(int,int) ...