用js模擬jQuery方法，體會封裝思想 <!DOCTYPE html><html><head><meta charset="UTF-8"><title>simulationJquery.html</title> </head><body> <img src=images/123.jpg/> <in ...
用js模擬jQuery方法，體會封裝思想
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>simulationJquery.html</title>
</head>
<body>
<img src=images/123.jpg/>
<input id="hide" type="button" value="hide" style="position:absolute;top:250;left:50"/>
<input id="show" type="button" value="show" style="position:absolute;top:250;lfet:120"/>
<script type="text/javascript">
function photo(){
var img=document.images[0];
this.hide=function(){
img.style.visibility="hide";
}
this.show=function(){
img.style.visibility="visible";
}
}
</script>
<script type="text/javascript">
//d()表示定位指定的標簽
function b(str){
//獲取str變數的類型
var type=typeof(str);
if(type=="string"){
//截取第一個字元串
var first=str.substring(0,1);
//判斷是否是＃號
if("#"==first){
//獲取＃號之後的字元串
var end=str.substring(1,str.length);
//根據ｉｄ定位標簽
var element=document.getElementById(end);
//如果找到了
if(element!=null){
return element;
}else{
alert("沒有這個標簽");
}
}
}else{
alert("參數必須是字元串");
}
}
</script>
<script type="text/javascript">
var p=new photo();
d("#hide").onclick=function(){
p.hide();
}
d("#show").onclick=function(){
p.show();
}
</script>
</body>
</html>
將上述中的方法名換成$符號，就是＂jquery＂了．
