建站
咨詢
售后
建站咨詢
新聞中心
作為一名前端開發(fā)者，Chrome內(nèi)置的控制臺(tái)是必須了解的，它擁有非常豐富的特性功能，對(duì)我們的開發(fā)幫助灰常大！
成都創(chuàng)新互聯(lián)服務(wù)項(xiàng)目包括石峰網(wǎng)站建設(shè)、石峰網(wǎng)站制作、石峰網(wǎng)頁制作以及石峰網(wǎng)絡(luò)營(yíng)銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢(shì)、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，石峰網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到石峰省份的部分城市，未來相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！
1、元素選擇器($)
如果你接觸過JQuery，那么對(duì)$()肯定不陌生，這是元素選擇器，用來選擇HTML元素，但現(xiàn)在，我們要了解的是控制臺(tái)中的$()。
打開百度，按F12打開控制臺(tái)
$() 相當(dāng)于JavaScript中的 document.querySelectorAll()，返回一個(gè)數(shù)組（后者返回的是類數(shù)組對(duì)象）。
注：本身 $() 應(yīng)該是 document.querySelector()，但今天測(cè)試卻是返回一組值，待考究。
就像上圖所示，可以 $()[index] 返回某一個(gè)元素。
其實(shí)還有不少快捷鍵：
$ // 相當(dāng)于 document.querySelector 。 $$ // 相當(dāng)于 document.querySelectorAll 。 $_ // 返回上一個(gè)表達(dá)式的值 $0-$4 // 返回最近5個(gè)Elements面板選中的DOM元素。 dir // console.dir keys // 取對(duì)象的鍵名, 返回鍵名組成的數(shù)組 values // 去對(duì)象的值, 返回值組成的數(shù)組
方向鍵盤的上下鍵
copy(content) // 將content（也可以說是content）復(fù)制到剪貼板
2、console
console相信大家用的最多，這里就不多介紹了，可以看這篇文章：《JavaScript在瀏覽器上的調(diào)試技巧》
3. 讓Chrome變成編輯器
在Chrome中，我們只需一行命令即可讓其變成編輯器：
document.body.contentEditable=true
4. clear()
如果你想清空控制臺(tái)和內(nèi)存，只需這樣：
clear()
接著點(diǎn)回車鍵即可。
下面再介紹一些有趣實(shí)用的功能：
1、截圖
其實(shí)chrome提供了一個(gè)截圖功能，但貌似只能在移動(dòng)模式。
2. 代碼格式化
有些時(shí)候，我們?cè)诳刂婆_(tái)的Sources中查看CSS或JavaScript文件時(shí)，會(huì)看到一堆壓縮的代碼，但只需點(diǎn)擊一下這里：
3. 打開命令菜單
按Cmd + Shift + P（Mac）或Ctrl + Shift + P（Windows，Linux）打開命令菜單。
4、隱藏部分console日志
如果日志太多，我們可以隱藏掉部分 Console 日志（在輸出日志的腳本上單擊右鍵，filter -> hide）
這里還發(fā)現(xiàn)了一個(gè)不錯(cuò)的關(guān)于Chrome開發(fā)工具的文檔：Chrome開發(fā)工具文檔
本文標(biāo)題：多了解一下Chrome開發(fā)者控制臺(tái)
文章鏈接：http://m.5511xx.com/article/cdepijh.html
