104 css selector encapsulation $('#ele').css() $('.ele').css() $('ele').css()_html/css_WEB-ITnose

//demo.js  调用

window.onload = function () {
    // $().getClass("a").css("color","red");//旧方法
  /*  $("#box").css("color", "red").click(function(){
        alert($(this).html())
    });*/
    //$(".a").css("color","green")
   // $("p").find(".a").css("color","blue");
    $("div").find("span").css("color","red")
  // $("div").find(".a").css("color","red");
    //$("div").find("#bb").css("color","red")


//$(".a").css("color","red")
};

//Base.js

var $=function(args)//Call, pass this over
{
return new Base(args);


};
/ /Object type
function Base(args)
{
//Create an array to get the node and the array of nodes
this.elements=[];//Private, not shared
if(typeof args=="string")//$(".a").css("color","green") is called and executed here
{
switch (args.charAt(0))
{
case "#":
this.elements.push(this.getId(args.substring(1)));
break;
case ".":
this.elements=this.getClass(args.substring(1));//getClassreturn is an array, so assign the value directly
break;
default:
this.elements = this.getTagName(args);/ /getClassreturn is an array, so assign the value directly
} }
} }
else if(typeof args=="object") // $().getClass("a").css("color"," red"); This call will be executed here
{
if(args!=undefined)//_this here is an object, and undefined is also an object, but don’t put back the "undefined with single quotes" in typeof ”
                                                                                                                                       . /Set css to select child nodes
Base.prototype.find=function(str)
{
var childElements=[];//Temporary array avoids conflict with base.element[]
for(var i=0;i {
switch (str.charAt(0))
{
case "#":
childElements.push(this .getId(str.substring(1)));
break;
case ".":
var all=this.elements[i].getElementsByTagName("*");
for(var j=0;j                                                                     childElements.push( all[j]);            for (var j = 0 ; j < temps.length; j ) {
                                                                                          
var tags=this.elements[i] .getElementsByTagName(str);
for(var j=0;j                                                  >                                                                                                                                                🎜> }
this.elements=childElements;
return this;
};


//Get ID node
Base.prototype.getId = function (id) {
//Return the own object of the ID node
return document.getElementById(id);
};
//Get the element node array
Base.prototype.getTagName = function (tag, parentNode) {
var node = null;
var temps = [];
if (parentNode != undefined) {
node = parentNode;
} else {
node = document ;
}
var tags = node.getElementsByTagName(tag);
for (var i = 0; i < tags.length; i ) {
temps.push(tags[i]);
}
return temps;
};
//class gets
Base.prototype.getClass=function(className,parentNode)
{
var node=null;
var temps=[] ;//Temporary array to avoid conflicts with base.element[]
if(parentNode!=undefined)
{
node=parentNode;
}
else
{
node =document;
}
var all=node.getElementsByTagName("*");
for(var i=0;i {
if(all [i].className==className)
                                                                                                    temps.push(all[i]);                                                                                      Array
};
//Get a node and return Base object
Base.prototype.eq=function(num)
{
var element=this.elements[num];
this.elements=[];//Clear the array
this.elements[0]=element;//Reassign value
return this; //Return something like jq’s eq()
};


//Get a node and put back the object of this node
Base.prototype.get=function(num)//
{
return this .elements[num];//Return something like jq’s get()
};
//Set CSS
Base.prototype.css = function (attr, value) {
for (var i = 0; i < this.elements.length; i ) {
            if (arguments.length == 1) {                                                                                                                                                                              Return is needed here
}
this.elements[i].style[attr] = value;
}
return this;
};
Base.prototype.click=function (fn)
{
for(var i=0;i {
this.elements[i].onclick=fn;
}
return this;
};
//Set innerHtml to get innerHTML
Base.prototype.html=function(value)
{


for(var i= 0;i                                                                 🎜> else
                                                                                                                                        };
/ /Add class
Base.prototype.addClass=function(className)
{
for(var i=0;i {
if(! hasClass(this.elements[i],className))//Determine whether this class already exists > Return this;
};
//Remove class
Base.prototype.removeClass=function(className) //Call method $().getClass("dd").addClass("a") .addClass("b").removeClass("b");
{
for(var i=0;i {
if(hasClass( this.elements[i],className))//Determine whether this class already exists
                                                                                                                                                                                                                                                                             ​\s|^)' className '(\s|$)'),'');
                                                                                                                                             css rules, not commonly used
Base.prototype.addRule=function(num,selectorText,cssText,position) //Call method, $().addRule(0,"body","background:red",0)
{
var sheet=document.styleSheets[num];
if(typeof sheet.insertRule!="undefined")//w3c
{
sheet.insertRule(selectorText "{" cssText "}",position);
}
else if(typeof sheet.addRule!="undefined")//iE
{
        sheet.addRule(selectorText,cssText,position);//sheet.addRule("body","background:red",)
    }
};
//移除link或style的css规则,不常用
Base.prototype.addRule=function(num,index) //调用方法，  $().removeRule(0);
{
    var sheet=document.styleSheets[num];
    if(typeof sheet.deleteRule!="undefined")//w3c
    {
        sheet.deleteRule(index);
    }
    else if(typeof  sheet.removeRule!="undefined")//iE
    {
        sheet.removeRule(index);//sheet.addRule("body","background:red",)
    }
};
//设置hover方法
Base.prototype.hover=function(over,out)
{
    for(var i=0;i     {
      //  this.elements[i].onmouseover=over;
       // this.elements[i].onmouseout=out;
        addEvent(this.elements[i],"mouseover",over);
        addEvent(this.elements[i],"mouseout",out)
    }
    return this;
};
//添加show
Base.prototype.show=function()
{
    for(var i=0;i     {
        this.elements[i].style.display="block"


    }
    return this;
};
//添加hide
Base.prototype.hide=function()
{
    for(var i=0;i     {
        this.elements[i].style.display="none"


    }
    return this;
};
//设置物体居中
Base.prototype.center=function(width,height)
{
    var top=(getInner().height-width)/2;
    var left=(getInner().width-height)/2;
    for(var i=0;i     {
        this.elements[i].style.top=top "px";
        this.elements[i].style.left=left "px";
    }
    return this;
};
//触发浏览器窗口事件
Base.prototype.resize = function (fn) {
    for(var i=0;i     {
        var element=this.elements[i];
       /* window.onresize=function()
        {
            fn();
            if (element.offsetLeft > getInner().width - element.offsetWidth) {
                element.style.left = getInner().width - element.offsetWidth 'px';
            }
            if (element.offsetTop > getInner().height - element.offsetHeight) {
                element.style.top = getInner().height - element.offsetHeight 'px';
            }
        }*/
        addEvent(window,"resize",function()
        {
            fn();
            if (element.offsetLeft > getInner().width - element.offsetWidth) {
                element.style.left = getInner().width - element.offsetWidth 'px';
            }
            if (element.offsetTop > getInner().height - element.offsetHeight) {
                element.style.top = getInner().height - element.offsetHeight 'px';
            }
        })
    }
    return this;
};
//锁屏功能
Base.prototype.lock=function()
{
    for(var i=0;i     {
        this.elements[i].style.width=getInner().width "px";
        this.elements[i].style.height=getInner().height "px";
        this.elements[i].style.display="block";
        document.documentElement.style.overflow = 'hidden';
        addEvent(window,"scroll",scrollTop);
    }


    return this;
};
function scrollTop(){
    document.documentElement.scrollTop=0;// IE W3C
    document.body.scrollTop=0;//火狐
}
Base.prototype.unlock=function()
{
    for(var i=0;i     {
        this.elements[i].style.display="none";
        document.documentElement.style.overflow = 'auto';
        removeEvent(window,"scroll",scrollTop);
    }


    return this;
};
//插件入口
Base.prototype.extend=function(name,fn)
{
    Base.prototype[name]=fn;
};


$().extend("bbb",function(){
   alert("123")
});