jquery源码学习--iceDog
/**
* @FileName : iceDog
* @Author : PheonixHkbxoic
* @Mail : hkbxoic@gmail.com
* @DateTime : 2016-04-23 14:55:33
* @Version : v1.0.0
* @Description: Description
*/ (function(window,undefined){
var doc = window.document; var _iceDog = function(selector){
return new _iceDog.fn.init(selector);//每次使用_iceDog对象,都是全新的
}; //原型
_iceDog.fn = _iceDog.prototype = {
//elems : [],//selector? []:_iceDog.prototype,
init : function(selector){
this.elems = [];//初始化容器,每次创建的对象都是全新的 if(selector){
if(typeof selector === 'boolean'){
this.elems.push(selector==true? true:this);
}else if (typeof selector === 'number') {
this.elems.push(selector);
}else if (typeof selector === 'function') {
//用回调函数处理
selector.call(this,this);
}else if (typeof selector === 'string' ){
if(selector.match(/^\#\S{3,}/)){//#id
this.elems.push(doc.getElementById(selector.substring(1)))
}else if (selector.match(/^\.\S{3,}/)) {//.class
var elarr = doc.all;
for (var i = 0; i < elarr.length; i++) {
if (elarr[i].className&&elarr[i].className.indexOf(selector.substring(1))!=-1) {
this.elems.push(elarr[i]);
} }
}else { //a,
var elarr = doc.getElementsByTagName(selector);
for (var i = 0; i < elarr.length; i++) {
this.elems.push(elarr[i]);
}
}
}else if (selector.nodeType) {
this.elems.push(selector);
} return this;
}else{//handle $(),$(""), $(null), $(undefined), $(false)
return this;
} },
css : function(attr,value){
if (arguments.length == 1) {
var attrvalue = [];
for (var i = 0; i < this.elems.length; i++) {
attrvalue[i] = this.elems[i].style[attr] ;
}
return attrvalue;
}else if (arguments.length == 2) {
for (var i = 0; i < this.elems.length; i++) {
this.elems[i].style[attr] = value;
}
return this;
}else{
throw new Error('the length of css arguments is between 1 and 2 !');
}
},
each:function(callback,args){//应该用回调函数
return _iceDog.each(this.elems,callback,args);
}
}; //原型传递
_iceDog.fn.init.prototype = _iceDog.prototype; /**
* 将要添加的静态方法或属性,复制给_iceDog 类
* 将要添加的对象方法或属性,复制给_iceDog.fn,即_iceDog.prototype原型,那么_iceDog 对象也就拥有了这些方法和属性
*/
_iceDog.extend = _iceDog.fn.extend = function(){
var target = arguments[0]||{};
for(name in target){
this[name] = target[name];
}
return target;
}; //_iceDog 类要添加的静态方法或属性
_iceDog.extend({
version:'iceDog v1.0.0',
showVersion:function(){
alert(this.version);
return this.version;
},
each:function(obj,callback,args){//应该用回调函数
var name,length = obj.length;
for(name in obj){
if(callback.call(obj[name],name,obj[name],args)===false){
break;
}
}
}
}); //_iceDog对象的属性或方法
_iceDog.fn.extend({
elems:[],
get:function(index){
return arguments.length==1?this.elems[index]:this.elems;
},
show:function(){
for(var i=0;i<this.elems.length;i++){
this.elems[i].style.display = 'block';
}
return this;
},
hide:function(){
for(var i=0;i<this.elems.length;i++){
this.elems[i].style.display = 'none';
}
return this;
},
addClass:function(className){
for(var i=0;i<this.elems.length;i++){
this.elems[i].className += ' '+className;
}
return this;
},
removeClass:function(className){
for(var i=0;i<this.elems.length;i++){
var clzz = this.elems[i].className;
clzz = clzz.replace(new RegExp(className),'');
clzz = clzz.replace(/\ $/,'');
this.elems[i].className= clzz;
}
return this;
},
val:function(val){ //获取或设置表单元素值
if (arguments.length==1) {
for(var i=0;i<this.elems.length;i++){
if(this.elems[i].hasAttribute('value')){
this.elems[i].value = val;
}
}
return this;
}
var values = [];
for(var i=0;i<this.elems.length;i++){
if(this.elems[i].hasAttribute('value')){
var value = this.elems[i].value;
if(value){
values.push(value);
}
}
}
return values;
},
text:function(textValue){ //获取或设置文本节点内容
if (arguments.length==1) {
for(var i=0;i<this.elems.length;i++){
this.elems[i].appendChild(doc.createTextNode(textValue));
}
return this;
}
var texts = [];
for(var i=0;i<this.elems.length;i++){
if(this.elems[i].nodeType == 1){//是元素节点,才有文本子节点
var text = [];
var childNodes = this.elems[i].childNodes;
for (var i = 0; i < childNodes.length; i++) {
if(childNodes[i].nodeType == 3){
//FireFox浏览器,空格和回车会认为是文本节点。需额外处理
childNodes[i].nodeValue = childNodes[i].nodeValue.replace(/\s+/,'');
if(childNodes[i].nodeValue){
text.push(childNodes[i].nodeValue);
}
}
}
texts.push(text);
}
}
return texts;
},
html:function(tag){ //获取或设置节点内容
if (arguments.length==1) {
for(var i=0;i<this.elems.length;i++){
this.elems[i].innerHTML=tag;
}
return this;
}
for(var i=0;i<this.elems.length;i++){
this.elems[i] = this.elems[i].innerHTML;
}
return this.elems;
},
append:function(node,createText){
if (arguments.length!=0) {
if(!node.nodeType){ //如果不是节点
if(createText&&createText==true){
node = doc.createTextNode(node); //创建文本节点
}else{
node = doc.createElement(node); //创建元素节点
}
}
for(var i=0;i<this.elems.length;i++){
this.elems[i].appendChild(node);
} //对于<div class='clzz'></div>该如何处理?
}
return this;
}
}); window.$ = window.iceDog = _iceDog;
})(window);
/*
console.log(_iceDog());
console.log(_iceDog('#box'));
console.log(_iceDog('#box').css('color','red').css('color'));
console.log(_iceDog);
// console.log(_iceDog.show());//不能运行。。。
console.log(_iceDog('#pox').show());
console.log(_iceDog('p').show()); console.log(_iceDog('.boxpox'));
console.log(_iceDog('.beblue').css('color','blue').css('color'));
*/ /*
(function(window){
var doc = window.document;
_iceDog = function(selector){
var obj = {
elems : selector? []:_iceDog.prototype,
init : function(selector){
if(selector){
if(selector.match(/^\#\S{3,}/)){//#id
this.elems.push(doc.getElementById(selector.substring(1)))
}else if (selector.match(/^\.\S{3,}/)) {//.class
var elarr = doc.all;
for (var i = 0; i < elarr.length; i++) {
if (elarr[i].className&&elarr[i].className.indexOf(selector.substring(1))!=-1) {
this.elems.push(elarr[i]);
} }
}else { //a,<a>
var elarr = doc.getElementsByTagName(selector);
for (var i = 0; i < elarr.length; i++) {
this.elems.push(elarr[i]);
}
}
return this;
}else{
return this;
} },
css : function(attr,value){
if (arguments.length == 1) {
var attrvalue = [];
for (var i = 0; i < this.elems.length; i++) {
attrvalue[i] = this.elems[i].style[attr] ;
}
return attrvalue;
}else if (arguments.length == 2) {
for (var i = 0; i < this.elems.length; i++) {
this.elems[i].style[attr] = value;
}
return this;
}else{
throw new Error('the length of css arguments is between 1 and 2 !');
}
},
show:function(){
return this.elems;
},
each:function(fun){//应该用回调函数
for (var i = 0; i < this.elems.length; i++) {
alert(this.elems[i]);
}
}
};
_iceDog.prototype = obj.init.prototype;//_iceDog.prototype = obj.init.prototype = obj; return obj.init(selector);
};
window.$ = window.iceDog = _iceDog;
})(window);
*/
jquery源码学习--iceDog的更多相关文章
- jquery源码学习笔记三:jQuery工厂剖析
jquery源码学习笔记二:jQuery工厂 jquery源码学习笔记一:总体结构 上两篇说过,query的核心是一个jQuery工厂.其代码如下 function( window, noGlobal ...
- jquery源码学习(一)——jquery结构概述以及如何合适的暴露全局变量
jQuery 源码学习是对js的能力提升很有帮助的一个方法,废话不说,我们来开始学习啦 我们学习的源码是jquery-2.0.3已经不支持IE6,7,8了,因为可以少学很多hack和兼容的方法. jq ...
- jQuery源码学习感想
还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码, ...
- 读艾伦的jQuery的无new构建,疑惑分析——jquery源码学习一
背景: 有心学习jquery源码,苦于自己水平有限,若自己研究,耗时耗力,且读懂之日无期. 所以,网上寻找高手的源码分析.再经过自己思考,整理,验证.以求有所收获. 此篇为读高手艾伦<jQuer ...
- jquery 源码学习(一)
从上边的注释看,jQuery的源码结构相当清晰.条理,不像代码那般晦涩和让人纠结 1. 总体架构 1.1 自调用匿名函数 self-invoking anonymous function 打开jQ ...
- jquery 源码学习(*)
最近在做日志统计程序,发现对方的程序是在Jquery基础上进行开发的,而公司的网站的框架是prototype.而且我也早就想了解一下Jquery源码,故决定研究Jquery源码,模拟它的方法 Jq ...
- 菜鸟的jQuery源码学习笔记(前言)
前言 相信任何一名前端开发人员或者是前端爱好者都对jQuery不陌生.jQuery简单易用,功能强大,特别是拥有良好的浏览器兼容性,大大降低了前端开发的难度,使得前端开发变得“平易近人起来”.自从本人 ...
- jQuery源码学习扒一扒jQuery对象初使化
神奇的jQuery可以这样玩jQuery("#id").css()或 jQuery("#id").html() 这么玩jQuery("#id" ...
- jQuery源码学习笔记一
学习jQuery源码,我主要是通过妙味视频上学习的.这里将所有的源码分析,还有一些自己弄懂过程中的方法及示例整理出来,供大家参考. 我用的jquery v2.0.3版本. var rootjQuery ...
随机推荐
- Servlet中的配置 web.xml
url-pattern配置 可以为同一个Servlet配置多个url-pattern: <servlet> <servlet-name>DoGetPostDemo</se ...
- 判断Windows操作系统的版本
private void Form1_Load(object sender, EventArgs e) { if (!IsWin7()) { Application.Exit(); } } bool ...
- 本地搭建SVN服务器 局域网
http://blog.csdn.net/sunbaigui/article/details/8466310
- VR就是下一个浪潮_2016 (GMGC) 全球移动游戏大会观后感
"VR就是下一个浪潮" --2016 (GMGC) 全球移动游戏大会观后感 早在2014年参会Unity举办的一年一度的金立方盛典大会,就初次体验了VR头盔设备,于是印象深刻 ...
- [ Office 365 开发系列 ] 开发模式分析
前言 本文完全原创,转载请说明出处,希望对大家有用. 在正式开发Office 365应用前,我们先了解一下Office 365的开发模式,根据不同的应用场景,我们选择最适合的开发模式. 阅读目录 Of ...
- Decks
Now that we have Card objects, the next step is to define a class to represent decks. Since a deck i ...
- javascript各种兼容性问题,不断更新
ie6-ie8 不支持textContent支持innerTextchrome 支持textContent innerTextfireFox 仅支持textContent不支持innerTe ...
- 創建HTTP 服務器
var http = require('http'); var fs = require('fs'); var server = http.createServer(function(req, res ...
- oracle权限
Oracle 权限 权限允许用户访问属于其它用户的对象或执行程序,ORACLE系统提供三种权限:Object 对象级.System 系统级.Role 角色级.这些权限可以授予给用户.特殊用户publi ...
- 【MySQL】TokuDB引擎初探(MySQL升级为Percona,MySQL升级为MariaDB)
参考:http://blog.sina.com.cn/s/blog_4673e6030102v46l.html 参考:http://hcymysql.blog.51cto.com/5223301/14 ...