实现以下目标：
1 连缀：类似：$().getid('main').css('color','red').html('标题')；
步骤：
1? 因为要在原型里写方法，所以采用函数式对象，即构造函数。
2? 将获取节点的方法和设置或获取属性及其他所有的方法写在base对象里。调用时只需new出一个base对象。
3? 避免在前台new出对象，在基础库里写一个方法var $=function(){return new base()},前台调用函数就行了。
思路：要实现连缀功能，必须每个方法的返回值是base对象，才能继续连缀，例如获取节点后，返回base对象设置css属性；
$().getid('main').css('color','red');? getid：获取id节点的方法和css：设置css属性的方法都是base对象的方法。所以只有获取id节点后返回base对象才能继续调用里面的css方法，同样css方法的返回值也要是base对象。
原理：将获取到的节点或节点数组作为属性放在属性数组里，同时获取节点的和、方法的返回值是base可以继续调用里面的方法。$().getid('main')将id为main的节点对象存放在this.elements数组里作为base对象（即$()）的属性；因为css()是base对象的方法，所以，getid()方法的返回值要写成base对象，在使用css()方法时就可使用存放的节点对象。
封装的库：base.js。 前台调用库demo.js。
base.js:
我要评论
var $=function(){ //这里写一个函数，调用时返回一个base对象
return new base();
}
function base(){
this.elements=[]; //创建属性数组 保存获取的节点数组,实例（私有）属性不要在原型里添加
}
// 不能base.prototype.elements=[]；比如设置了一个id为main的颜色；再设置id为其它的颜色会把main的颜色覆盖掉，因为在原型里添加属于共有
// 获取id节点的方法
base.prototype.getid=function(id){
this.elements.push(document.getelementbyid(id)); //将节点存入数组中
return this; //返回base对象实现连缀
}
//获取name节点数组的方法
base.prototype.getname=function(name){
var name=document.getelementsbyname(name);
for(var i=0;ihtml:
main
段落
前台调用库：demo.js:
测试1：获取:
window.onload=function(){
console.log($().getid('main').css('color'));
console.log($().gettagname('p').css('color'));
console.log($().getname('button').css('color'))
}
图示：
测试2：设置：
window.onload=function(){
$().getid('main').css('color','blue');
$().gettagname('p').css('color','blue');
$().getname('button').css('color','blue')
}
图示：
ps:如何写函数：
例如：设置css属性，先思考不用函数怎么设置，即：document.getelementbyid('main').style.color=red;
改成函数：设置两个参数，属性及属性值（attr,value)。互相对应：this.element[i].style.attr=value.适用于任何函数
如对本文有疑问， 点击进行留言回复！！
同事牛逼啊，写了个隐藏 bug，我排查了 3 天才解决问题！
【JavaScript笔记（一）】万丈高楼平地起 - 基本概念篇
轻松解决 org.apache.taglibs.standard.tlv.JstlCoreTLV 困惑
网友评论