javascript library
<!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的更多相关文章
- 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 ...
- 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 ...
- Raphaël—JavaScript Library
Raphaël-JavaScript Library What is it? Raphaël is a small JavaScript library that should simplify yo ...
- a Javascript library for training Deep Learning models
w强化算法和数学,来迎接机器学习.神经网络. http://cs.stanford.edu/people/karpathy/convnetjs/ ConvNetJS is a Javascript l ...
- JavaScript 工具库:Cloudgamer JavaScript Library v0.1 发布
JavaScript 工具库:Cloudgamer JavaScript Library v0.1 发布 研究了一年多的js,也差不多写一个自己的js库了.我写这个不算框架,只是一个小型的js工具 ...
- jQuery JavaScript Library v3.2.1
/*! * jQuery JavaScript Library v3.2.1 * https://jquery.com/ * * Includes Sizzle.js * https://sizzle ...
- 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- ...
- 转:Build Your First JavaScript Library
http://net.tutsplus.com/tutorials/javascript-ajax/build-your-first-javascript-library/ Step 1: Creat ...
- [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 本篇是 ...
随机推荐
- LeetCode Shell Problems
195. Tenth Line -- 第十行 How would you print just the 10th line of a file? Solution: awk 'NR==10' file ...
- 在Eclipse新建菜单中添加JSP
在开发的时候,大家可能选择不同的透视图,下面以Java EE透视图为例. 在项目上右键,选择new命令,出来的菜单中并没有新建JSP的选项. 这样一来,如果想新建JSP,只能选择Other命令,在里面 ...
- PF_PACKET在内核的流程
PF_PACKET在内核的流程 套接字创建 packet_create() --> 赋值packet_ops 接收流程 packet_recvmsg() skb_recv_datagra ...
- 链路层三种类型的MAC地址
若需要转载,请注明出处. 我们知道,链路层都是以MAC地址来进行通信双方的地址标识的,如下图:在应用中根据接收方的多寡来进行划分,可分为以下三种: 单播(Unicast) 多播(Multicast) ...
- Ajax status状态详解
readyState属性包括五种可能的取值: 0: (未初始化)send方法还没有被调用1: (加载中)已调用了send方法,请求还在处理2: (已加载)send方法已完成,整个应答已接收3: (交互 ...
- 可执行文件(ELF)格式之讲解
ELF(Executable and Linking Format)是一种对象文件的格式,用于定义不同类型的对象文件(Object files)中都放了什么东西.以及都以什么样的格式去放这些东西.它自 ...
- sql server 2008 执行计划
SSMS允许我们查看一个图形化的执行计划(快捷键Ctrl+L)
- AssetBundle依赖关系
原地址:http://www.cnblogs.com/realtimepixels/p/3652086.html Unity AssetBundle Dependencies In the last ...
- chapter 2
1.分片:序列变量,字符串,列表,元组,集合..都可以使用分片来访问指定的数据项,分片三种方式:seq[]访问某个数据项,seq[-1]表示访问序列最后一个数据项,seq[-2]倒数第二个数据项. s ...
- 3[doses] ------一种诡异的写法
在 head first c 的第60页,有这么一道题: 一个富翁因为服药过度而死亡. 下面是自动服药器的代码: #include <stdio.h> int main(void) { , ...