Chrome 瀏覽器中執(zhí)行 JavaScript
本章節(jié)為大家介紹如何在 Chrome 瀏覽器上進(jìn)行 JavaScript 代碼的運(yùn)行與調(diào)試。
Chrome 是由 Google 開(kāi)發(fā)的免費(fèi)網(wǎng)頁(yè)瀏覽器,對(duì)于前端開(kāi)發(fā)來(lái)說(shuō)(尤其是調(diào)試代碼)非常方便。
Chrome 官網(wǎng)地址:https://www.google.com/intl/zh-CN/chrome/。
我們?cè)?Chrome 瀏覽器中可以通過(guò)按下 F12 按鈕或者右擊頁(yè)面,選擇"檢查"來(lái)開(kāi)啟開(kāi)發(fā)者工具。
也可以在右上角菜單欄選擇 "更多工具"=》"開(kāi)發(fā)者工具" 來(lái)開(kāi)啟:
1、Console 窗口調(diào)試 JavaScript 代碼
打開(kāi)開(kāi)發(fā)者工具后,我們可以在 Console 窗口調(diào)試 JavaScript代碼,如下圖:
上圖中我們?cè)?nbsp;> 符號(hào)后輸入我們要執(zhí)行的代碼 console.log("runoob"),按回車(chē)后執(zhí)行。
我們也可以在其他地方復(fù)制一段代碼過(guò)來(lái)執(zhí)行,比如復(fù)制以下代碼到 Console 窗口,按回車(chē)執(zhí)行:
console.log("runoob-1") console.log("runoob-2")
清空 Console 窗口到內(nèi)容可以按以下按鈕:
2、Chrome snippets 小腳本
我們也可以在 Chrome 瀏覽器中創(chuàng)建一個(gè)腳本來(lái)執(zhí)行,在開(kāi)發(fā)者工具中點(diǎn)擊 Sources 面板,選擇 Snippets 選項(xiàng)卡,在導(dǎo)航器中右擊鼠標(biāo),然后選擇 Creat new snippet 來(lái)新建一個(gè)腳本文件:
如果你沒(méi)看到 Snippets ,可以點(diǎn)下面板上到 >> 就能看到了。
點(diǎn)擊 Creat new snippet 后,會(huì)自動(dòng)創(chuàng)建一個(gè)文件,你只需在右側(cè)窗口輸入以下代碼,然后按 Command+S(Mac)或 Ctrl+S(Windows 和 Linux)保存更改即可。
console.log("runoob-1") console.log("runoob-2")
保存后,右擊文件名,選擇 "Run" 執(zhí)行代碼: