你知道jquery是怎么写的么?看完我写的这个例子你就知道原理的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="网站,微网站,App建设联系QQ:632175205 陈先生" />
<title>你知道jquery是怎么写的么?看完我写的这个例子你就知道原理的</title>
</head>
<body>
<p>这个只是一个例子</p>
<h1 id="myh1">我是h1标题<span style="display:none;">我是span</span></h1>
<script>
//原创QQ:632175205
function $(idname){
var cla={
init:function(name){
var t=this;//this指向t变量,this就是指cla这个变量(t也是cla),这样子以便其它函数访问,因为每个函数都有自己的this
if(name.indexOf("#")!=-1){
var arr=name.split("#");
var id=arr[1];
t.obj=document.getElementById(id);
}
},css:function(opt){
var t=this;
if(t.obj!=null){
for(var key in opt){
t.obj.style[key]=opt[key];
}
}
return t;//迷局就是return ,这里的t就是cla这个变量,也叫类吧!这里一定要返回不然就不能.css({'color',"#fff"}).css({'color',"#fff"})一直点一下的
},show:function(){
var t=this;
if(t.obj){
t.obj.style.display="";
}
return t;//迷局就是return ,这里的t就是cla这个变量,也叫类吧!这里一定要返回不然就不能.css({'color',"#fff"}).css({'color',"#fff"})一直点一下的
},hide:function(){
var t=this;
if(t.obj){
t.obj.style.display="none";
}
return t;//迷局就是return ,这里的t就是cla这个变量,也叫类吧!这里一定要返回不然就不能.css({'color',"#fff"}).css({'color',"#fff"})一直点一下的
},find:function(lable){
var t=this;
var childs=t.obj.getElementsByTagName(lable);//getElementsByTagName获取的是一个数组元素,getElements后有个s的
if(childs.length){
t.obj=childs[0];//对象改变成现在查到的这个例子
}
return t;//迷局就是return ,这里的t就是cla这个变量,也叫类吧!这里一定要返回不然就不能.css({'color',"#fff"}).css({'color',"#fff"})一直点一下的
}
}
cla.index=0;//初始值
cla.init(idname);
return cla;
}
$("#myh1").css({"color":"#FF0000"}).css({"background-color":"#000000"}).find("span").css({"font-size":"100px","color":"#FFFFFF"}).show().css({"border":"solid #F36 1px"});//看调用方式是不是跟你手里的用的jq一模一样呢!
</script>
</body>
</html>