<!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. CodeColorer支持的语言

    CodeColorer支持的语言有:abap, actionscript, actionscript3, ada, apache, applescript, apt_sources, asm, asp ...

  2. jQuery 效果 - slideDown() 方法[菜单导航栏常用]

    实例 以滑动方式显示隐藏的 <p> 元素: $(".btn2").click(function(){ $("p").slideDown(); }); ...

  3. PowerDesigner中创建Oracle表全过程记录

    本文记录如何在PowerDesigner中创建一个Oracle结构的表. 在进行本文阅读之前,需要在PowerDesigner进行 DBMS修改,DataBase创建,用户创建,表空间创建.   1. ...

  4. javascript中继承(一)-----原型链继承的个人理解

    [寒暄]好久没有更新博客了,说来话长,因为我下定决心要从一个后台程序员转为Front End,其间走过了一段漫长而艰辛的时光,今天跟大家分享下自己对javascript中原型链继承的理解. 总的说来, ...

  5. 浅谈css中的position

    什么是position,根据css 2.1中的描述,position和float的值决定了浏览器要采用那种定位算法来计算元素盒子的具体位置.先避开float不谈,本文主要介绍position属性的不同 ...

  6. wireshark常用的过滤命令

    我们使用wireshark抓包,却不知道如何分析这些包,也无法从海量的包中提取自己需要的数据,下面简单介绍下wireshark的过滤规则. 过滤源ip.目的ip.在wireshark的过滤规则框Fil ...

  7. FormCreate & FormActivate & FormShow执行顺序演示

    procedure TForm1.FormCreate(Sender: TObject);begin  form1.Caption:=form1.Caption +'+Create'; end; pr ...

  8. sprytabbedpanels.js库之在页面中插入Tabbed Panels

    向页面加入sprytabbedpanels.js文件.<script src="SpryAssets/SpryTabbedPanels.js" type="text ...

  9. maven 常用5个命令

    1. mvn help:describe 你是否因为记不清某个插件有哪些goal而痛苦过,你是否因为想不起某个goal有哪些参数而苦恼,那就试试这个命令吧,它会告诉你一切的. 参数: 1. -Dplu ...

  10. ftp命令和scp命令

    ftp命令: 服务器有安装ftp Server,另外一台linux可以使用ftp的client程序来进行文件的拷贝读取和下载. 1. 连接ftp服务器  格式:ftp [hostname| ip-ad ...