這篇文章主要介紹“怎么將Chrome調(diào)試器里的JavaScript變量保存成本地JSON文件”，在日常操作中，相信很多人在怎么將Chrome調(diào)試器里的JavaScript變量保存成本地JSON文件問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”怎么將Chrome調(diào)試器里的JavaScript變量保存成本地JSON文件”的疑惑有所幫助！接下來，請跟著小編一起來學(xué)習(xí)吧！

創(chuàng)新互聯(lián)建站是一家集網(wǎng)站建設(shè),河源企業(yè)網(wǎng)站建設(shè),河源品牌網(wǎng)站建設(shè),網(wǎng)站定制,河源網(wǎng)站建設(shè)報價,網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,河源網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強企業(yè)競爭力?？沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時我們時刻保持專業(yè)、時尚、前沿，時刻以成就客戶成長自我，堅持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實用型網(wǎng)站。

我們在Chrome開發(fā)者工具的Console標(biāo)簽頁里，可以輸入JavaScript變量然后回車，查看這些變量的值。

比如我用類jQuery選擇器的語法 var button = $('button')來返回當(dāng)前頁面所有button標(biāo)簽的實例。

如果我想將這個變量保存到本地，以備以后進(jìn)一步分析，一種做法是用JSON.stringfy將其序列號成JSON字符串，然后再手動選中該字符串，新建一個本地文件，復(fù)制進(jìn)去并保存。

這套辦法可行但是太麻煩了?，F(xiàn)在我向大家分享一種自動化的做法。

(function(console){

console.save = function(data, filename){

if(!data) {

console.error('Console.save: No data')

return;

}

if(!filename) filename = 'console.json'

if(typeof data === "object"){

data = JSON.stringify(data, undefined, 4)

}

var blob = new Blob([data], {type: 'text/json'}),

e = document.createEvent('MouseEvents'),

a = document.createElement('a')

a.download = filename

a.href = window.URL.createObjectURL(blob)

a.dataset.downloadurl = ['text/json', a.download, a.href].join(':')

e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)

a.dispatchEvent(e)

}

})(console)

把這段代碼粘貼到Chrome開發(fā)者工具的console標(biāo)簽頁執(zhí)行，給標(biāo)準(zhǔn)的console對象新增一個save方法。這個方法有兩個輸入?yún)?shù)，第一個為待保存成本地JSON文件的JavaScript變量，第二個參數(shù)為本地JSON文件的名稱。

還是回到上面的例子，我在Chrome開發(fā)者工具的console頁面執(zhí)行了上述的JavaScript代碼后，緊接著再執(zhí)行下面的語句：

console.save(button, "button.json");

回車，Chrome自動彈出一個JSON文件保存窗口：

保存到本地即可。這種方式省去了手動將JavaScript變量序列化成JSON string再手動保存成本地文件的工作量，提升了程序員的工作效率。

到此，關(guān)于“怎么將Chrome調(diào)試器里的JavaScript變量保存成本地JSON文件”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識，請繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>
本文名稱：怎么將Chrome調(diào)試器里的JavaScript變量保存成本地JSON文件
文章轉(zhuǎn)載：http://weahome.cn/article/jchhsd.html