这些天,我经常会碰到一些问题,由于自己不是很熟练Jquery库和自己所定义的base库的区别。
下面我就简单的来说说,它们二者之间的区别。个人认为在使用Jquery库和自己定义的base库在一定的程度上是水火不相容的。
他们不相容,是因为在下面的代码中,我并没有模拟CSS,也没有使其进行封装。所以类似于$('#b');的写法并不会产生效果。
在我们引入jquery库的时候,$().getId('b');这种方法因为jquery库里面没有,所以也会报错。
在我引入jquery时,登录框是完全可以用的。因为它没有用到我在base库里面的任何方法。
//登录框
/*
var top=(document.documentElement.clientHeight-250)/2;
var left=(document.documentElement.clientWidth-350)/2;
$('#login').css('top',top+'px').css('left',left+'px');
window.onresize=function(){
var top=(document.documentElement.clientHeight-250)/2;
var left=(document.documentElement.clientWidth-350)/2;
$('#login').css('top',top+'px').css('left',left+'px');
}
$('.login').click(function(){
$('#login').css('display','block');
$('#screen').lock;
});
$('.close').click(function(){
$('#login').css('display','none');
$('#screen').unlock;
});
下面是我自己在base库中定义的一个使登录界面居中的方法
//设置物体居中
Base.prototype.center=function(width,height){
var top=(document.documentElement.clientHeight-250)/2;
var left=(document.documentElement.clientWidth-350)/2;
for(var i=0;i<this.elements.length;i++){
this.elements[i].style.top=top+'px';
this.elements[i].style.left=left+'px';
}
return this;
}
在引入了jquery的情况下,我想用jquery的方法调用base库里面的方法,是不可能的。它会报错。
要解决这样的方法。必须把调用代码变成如下
$().getId('login').center(350,250).resize(function(){
$().getId('login').center(350,250);
});
并且,要删除jquery引用,方能解决问题。