你知道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>