DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> 客戶端腳本中常常出現的一些問題和調試技巧
客戶端腳本中常常出現的一些問題和調試技巧
編輯:JavaScript基礎知識     
1.出錯情況:語法錯誤
<div id=div1></div>
<script language="javascript">
document.write("never-online";
</script>
解釋:上面的示例是一個典型例子,方法名都要用()括起來()裡的是參數。
也許有人不屑一顧,但在論壇中。這種錯誤不在少數。
Tips:這種問題解決起來比較簡單,一般都可以解決。

2.出錯情況:引號用法不正確
<script>
s="alert("never-online")";
</script>
解釋:在javascript或是vbscript的編程中,引號出錯的機率是很大的,不管是有多豐富的編程經驗,遇到大量的字符串拼接,或者是一不小心的敲錯'("),都會出現“語法錯誤”或者是“缺少'”。
Tips:在進行大量的字符拼接時,需要注意引號的轉義用法。如上面的就可以寫成:s="alert(\"never-online\")";或者s='alert("never-online")';
相關鏈接:js技巧--轉義符"\"的妙用 - http://blog.csdn.net/bluedestiny/archive/2006/03/15/625061.aspx

3.出錯情況:未知軟性錯誤

<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>

運行出來,沒有提示錯誤,這給人一個錯覺,像類似這種軟性錯誤是比較難找的。
所以平常寫程序,必須細心。
Tips:編程時應該注意自己的習慣,像在for(var i=0;i<cntMax;i++);這裡,分號如果用了{來括起來,這種情況就完全可以避免,看SDK文檔時,要仔細閱讀,大小寫出錯一般都會“對象沒有此方法”之類的提示,但在腳本中,對象可以動態的添加方法和屬性。所以,上面的div.innerHtml="http://www.never-online.net"不會出錯。而div的innerHTML又沒有得到值。

4.出錯情況:對語言的理解錯誤
最常見的可能算是this關鍵字了,這裡就舉一個例子來說明
this語義:指向當前對象的指針。
例子:
<script>
function a() {
this.m = "never-online";
this.f = function() {
alert(this.m);
}
}
var b = new a();
b.f();
</script>
相信上面這個例子,很多人都理解。this指向的是a()
再看下面這個例子:
<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>
這一個例子,有些兄弟可能就不能理解了,仔細看看之後,也可以預測輸出結果。
解釋:this.m = val = 'never-online'這一句是賦值,其中的this.m中的this指向的是當前對象a();
而div.onmouseover裡的this指的對象是document.getElementById("div1")這個對象,(因為div並不屬於a對象)即相當於把代碼寫在這裡:
<div id=div1 onmouseover="alert(this.m)">div container - onmouseover handle</div>
因此在div.onmouseover的function裡this.m出現undefined並不奇怪。 
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved