想必很多小伙伴都有過(guò)這樣的經(jīng)歷,在前端開(kāi)發(fā)的過(guò)程中我們會(huì)遇到許多的調(diào)試之類的問(wèn)題,那么今天我們就來(lái)說(shuō)說(shuō)有關(guān)于“JavaScript怎么調(diào)試?”這個(gè)問(wèn)題。下面是小編整的相關(guān)內(nèi)容,希望對(duì)大家的學(xué)習(xí)和來(lái)了解有所幫助!
對(duì)于這個(gè)問(wèn)題的話我們?cè)跊](méi)有調(diào)試器的情況下寫(xiě)JavaScript是有難度的,這樣子我們?cè)跁?shū)寫(xiě)代碼的時(shí)候會(huì)很多的問(wèn)題,語(yǔ)法錯(cuò)誤、邏輯錯(cuò)誤這些都是比較難以診斷的。一般我們?cè)跁?shū)寫(xiě)代碼有問(wèn)題的時(shí)候不會(huì)發(fā)生任何事情也不會(huì)給我們錯(cuò)誤的消息提示。
1、console.log()方法:
我們來(lái)看看下面這個(gè)代碼:
<html>
<body>
<h1>我的第一張網(wǎng)頁(yè)</h1>
<p>使用F12在瀏覽器(Chrome、IE、Firefox)中激活調(diào)試,然后在調(diào)試器菜單中選擇“控制臺(tái)”。</p>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
對(duì)于這個(gè)方法我們還是需要瀏覽器支持的,那么我們就可以使用這個(gè)方法來(lái)查看我們頁(yè)面中JavaScript的值,一般都可以在瀏覽器中點(diǎn)擊F12進(jìn)行打開(kāi)我們的控制器進(jìn)行調(diào)試。
2、設(shè)置斷點(diǎn)
我們可以通過(guò)在調(diào)試窗口中的JavaScript代碼中設(shè)置斷點(diǎn),而且在每個(gè)斷點(diǎn)中,JavaScript將停止執(zhí)行可以方便我們查詢JavaScript的值,而且在查詢之后還可以恢復(fù)我們代碼的執(zhí)行。
3、debugger關(guān)鍵詞
在使用這個(gè)方法的時(shí)候是會(huì)停止JavaScript的執(zhí)行,還會(huì)進(jìn)行調(diào)用我們的調(diào)試函數(shù),這就和我們的調(diào)試器中的設(shè)置斷點(diǎn)的功能時(shí)一樣的了,我們可以看看下面這個(gè)代碼:
<html>
<head>
</head>
<body>
<p id="demo"></p>
<p>打開(kāi)調(diào)試器后,下面的代碼應(yīng)該在執(zhí)行第三行之前停止執(zhí)行。</p>
<script>
var x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
當(dāng)我們?cè)谶M(jìn)行使用這個(gè)方法的時(shí)候,上面的代碼中會(huì)在執(zhí)行第三行之前停止運(yùn)行。
4、主流瀏覽器的調(diào)試工具
Chrome
打開(kāi)瀏覽器 ,從菜單中選擇工具 ,從工具中選擇開(kāi)發(fā)者工具,最后,選擇控制臺(tái)。
Firefox Firebug
打開(kāi)瀏覽器,前往網(wǎng)頁(yè):http://www.getfirebug.com ,根據(jù)如下指令:如何安裝 Firebug。
Internet Explorer
打開(kāi)瀏覽器 ,從菜單選擇工具,從工具選擇開(kāi)發(fā)者工具 最后,選擇控制臺(tái)。
Opera
打開(kāi)瀏覽器,請(qǐng)前往網(wǎng)頁(yè):http://dev.opera.com,根據(jù)如下指令:如何安裝 Firebug Lite。
Safari Develop Menu
點(diǎn)擊 Safari 菜單,偏好設(shè)置,高級(jí),之后我們?cè)谕ㄟ^(guò)選中“在菜單欄中啟用開(kāi)發(fā)菜單”,當(dāng)菜單中出現(xiàn)新選項(xiàng)“開(kāi)發(fā)”時(shí),選擇“顯示錯(cuò)誤控制臺(tái)”。
總結(jié):
以上就是有關(guān)于“JavaScript怎么調(diào)試?”的問(wèn)題,如果你有什么更好的方法也可以和大家一同分享,更多有關(guān)于JavaScript這方面的相關(guān)內(nèi)容我們都可以在W3Cschool中進(jìn)行學(xué)習(xí)和了解。當(dāng)然對(duì)于我們說(shuō)到的有關(guān)于JavaScript調(diào)試的話我們還是要考慮實(shí)際的運(yùn)用情況來(lái)決定的。