客戶端腳本中常常出現(xiàn)的一些問題和調(diào)試技巧
更新時(shí)間:2007年01月09日 00:00:00 作者:
1.出錯(cuò)情況:語(yǔ)法錯(cuò)誤
<div id=div1></div>
<script language="javascript">
document.write("never-online";
</script>
解釋:上面的示例是一個(gè)典型例子,方法名都要用()括起來()里的是參數(shù)。
也許有人不屑一顧,但在論壇中。這種錯(cuò)誤不在少數(shù)。
Tips:這種問題解決起來比較簡(jiǎn)單,一般都可以解決。
2.出錯(cuò)情況:引號(hào)用法不正確
<script>
s="alert("never-online")";
</script>
解釋:在javascript或是vbscript的編程中,引號(hào)出錯(cuò)的機(jī)率是很大的,不管是有多豐富的編程經(jīng)驗(yàn),遇到大量的字符串拼接,或者是一不小心的敲錯(cuò)'("),都會(huì)出現(xiàn)“語(yǔ)法錯(cuò)誤”或者是“缺少'”。
Tips:在進(jìn)行大量的字符拼接時(shí),需要注意引號(hào)的轉(zhuǎn)義用法。如上面的就可以寫成:s="alert(\"never-online\")";或者s='alert("never-online")';
相關(guān)鏈接:js技巧--轉(zhuǎn)義符"\"的妙用 - http://blog.csdn.net/bluedestiny/archive/2006/03/15/625061.aspx
3.出錯(cuò)情況:未知軟性錯(cuò)誤
<script language="javascript">
cntMax=100;
div=document.createElement("DIV");
document.body.appendChild(div);
var myFun=function() {
for(var i=0;i<cntMax;i++);
div.innerHTML+="<b>i: " +i+ "</b><br/>";
div.innerHtml+="http://www.never-online.net";
}
myFun();
</script>
運(yùn)行出來,沒有提示錯(cuò)誤,這給人一個(gè)錯(cuò)覺,像類似這種軟性錯(cuò)誤是比較難找的。
所以平常寫程序,必須細(xì)心。
Tips:編程時(shí)應(yīng)該注意自己的習(xí)慣,像在for(var i=0;i<cntMax;i++);這里,分號(hào)如果用了{(lán)來括起來,這種情況就完全可以避免,看SDK文檔時(shí),要仔細(xì)閱讀,大小寫出錯(cuò)一般都會(huì)“對(duì)象沒有此方法”之類的提示,但在腳本中,對(duì)象可以動(dòng)態(tài)的添加方法和屬性。所以,上面的div.innerHtml="http://www.never-online.net"不會(huì)出錯(cuò)。而div的innerHTML又沒有得到值。
4.出錯(cuò)情況:對(duì)語(yǔ)言的理解錯(cuò)誤
最常見的可能算是this關(guān)鍵字了,這里就舉一個(gè)例子來說明
this語(yǔ)義:指向當(dāng)前對(duì)象的指針。
例子:
<script>
function a() {
this.m = "never-online";
this.f = function() {
alert(this.m);
}
}
var b = new a();
b.f();
</script>
相信上面這個(gè)例子,很多人都理解。this指向的是a()
再看下面這個(gè)例子:
<div id=div1>div container - onmouseover handle</div>
<script>
function a() {
this.m = val = 'never-online';
var div = document.getElementById("div1");
div.onmouseover=function() {
alert(this.m);
}
alert(this.m);
}
a();
</script>
這一個(gè)例子,有些兄弟可能就不能理解了,仔細(xì)看看之后,也可以預(yù)測(cè)輸出結(jié)果。
解釋:this.m = val = 'never-online'這一句是賦值,其中的this.m中的this指向的是當(dāng)前對(duì)象a();
而div.onmouseover里的this指的對(duì)象是document.getElementById("div1")這個(gè)對(duì)象,(因?yàn)閐iv并不屬于a對(duì)象)即相當(dāng)于把代碼寫在這里:
<div id=div1 onmouseover="alert(this.m)">div container - onmouseover handle</div>
因此在div.onmouseover的function里this.m出現(xiàn)undefined并不奇怪。
<div id=div1></div>
<script language="javascript">
document.write("never-online";
</script>
解釋:上面的示例是一個(gè)典型例子,方法名都要用()括起來()里的是參數(shù)。
也許有人不屑一顧,但在論壇中。這種錯(cuò)誤不在少數(shù)。
Tips:這種問題解決起來比較簡(jiǎn)單,一般都可以解決。
2.出錯(cuò)情況:引號(hào)用法不正確
<script>
s="alert("never-online")";
</script>
解釋:在javascript或是vbscript的編程中,引號(hào)出錯(cuò)的機(jī)率是很大的,不管是有多豐富的編程經(jīng)驗(yàn),遇到大量的字符串拼接,或者是一不小心的敲錯(cuò)'("),都會(huì)出現(xiàn)“語(yǔ)法錯(cuò)誤”或者是“缺少'”。
Tips:在進(jìn)行大量的字符拼接時(shí),需要注意引號(hào)的轉(zhuǎn)義用法。如上面的就可以寫成:s="alert(\"never-online\")";或者s='alert("never-online")';
相關(guān)鏈接:js技巧--轉(zhuǎn)義符"\"的妙用 - http://blog.csdn.net/bluedestiny/archive/2006/03/15/625061.aspx
3.出錯(cuò)情況:未知軟性錯(cuò)誤
<script language="javascript">
cntMax=100;
div=document.createElement("DIV");
document.body.appendChild(div);
var myFun=function() {
for(var i=0;i<cntMax;i++);
div.innerHTML+="<b>i: " +i+ "</b><br/>";
div.innerHtml+="http://www.never-online.net";
}
myFun();
</script>
運(yùn)行出來,沒有提示錯(cuò)誤,這給人一個(gè)錯(cuò)覺,像類似這種軟性錯(cuò)誤是比較難找的。
所以平常寫程序,必須細(xì)心。
Tips:編程時(shí)應(yīng)該注意自己的習(xí)慣,像在for(var i=0;i<cntMax;i++);這里,分號(hào)如果用了{(lán)來括起來,這種情況就完全可以避免,看SDK文檔時(shí),要仔細(xì)閱讀,大小寫出錯(cuò)一般都會(huì)“對(duì)象沒有此方法”之類的提示,但在腳本中,對(duì)象可以動(dòng)態(tài)的添加方法和屬性。所以,上面的div.innerHtml="http://www.never-online.net"不會(huì)出錯(cuò)。而div的innerHTML又沒有得到值。
4.出錯(cuò)情況:對(duì)語(yǔ)言的理解錯(cuò)誤
最常見的可能算是this關(guān)鍵字了,這里就舉一個(gè)例子來說明
this語(yǔ)義:指向當(dāng)前對(duì)象的指針。
例子:
<script>
function a() {
this.m = "never-online";
this.f = function() {
alert(this.m);
}
}
var b = new a();
b.f();
</script>
相信上面這個(gè)例子,很多人都理解。this指向的是a()
再看下面這個(gè)例子:
<div id=div1>div container - onmouseover handle</div>
<script>
function a() {
this.m = val = 'never-online';
var div = document.getElementById("div1");
div.onmouseover=function() {
alert(this.m);
}
alert(this.m);
}
a();
</script>
這一個(gè)例子,有些兄弟可能就不能理解了,仔細(xì)看看之后,也可以預(yù)測(cè)輸出結(jié)果。
解釋:this.m = val = 'never-online'這一句是賦值,其中的this.m中的this指向的是當(dāng)前對(duì)象a();
而div.onmouseover里的this指的對(duì)象是document.getElementById("div1")這個(gè)對(duì)象,(因?yàn)閐iv并不屬于a對(duì)象)即相當(dāng)于把代碼寫在這里:
<div id=div1 onmouseover="alert(this.m)">div container - onmouseover handle</div>
因此在div.onmouseover的function里this.m出現(xiàn)undefined并不奇怪。
相關(guān)文章
javascript中的onkeyup和onkeydown區(qū)別介紹
文本框里輸入的時(shí)候要開始計(jì)算文本框里面輸入了多少字,自然想到了onkeydown事件,然后計(jì)算value.length的方法,下面看下具體的代碼2013-04-04javascript學(xué)習(xí)筆記(十五) js間歇調(diào)用和超時(shí)調(diào)用
javascript學(xué)習(xí)筆記之js間歇調(diào)用和超時(shí)調(diào)用介紹,學(xué)習(xí)js的朋友可以參考下2012-06-06Zero Clipboard js+swf實(shí)現(xiàn)的復(fù)制功能使用方法
如何使用 Zero Clipboard ,其實(shí)注意測(cè)試環(huán)境要在 web環(huán)境中。2010-03-03如何讓頁(yè)面在打開時(shí)自動(dòng)刷新一次讓圖片全部顯示
我的網(wǎng)頁(yè)的圖片較多,而服務(wù)器也不是很好,所以每次打開網(wǎng)頁(yè)后總有一、兩幅圖片無法顯示,但刷新一遍后又全部可顯示了,這種問題相信每個(gè)人都遇到過,接下來介紹詳細(xì)解決方法2012-12-12HTML復(fù)選框和單選框 checkbox和radio事件介紹
checkbox 和 radio的事件選擇一度讓我很迷惑,開始以我對(duì)js的理解,我覺得change事件應(yīng)該是最合理的,可惜啊ie下change事件是在改變后焦點(diǎn)離開時(shí)才觸發(fā)2012-12-12