本文目錄一覽:
- 1、console.log()是什麼意思?
- 2、console.log()的作用
- 3、javascript 中的console.log有什麼作用啊?是做什麼的呢?謝謝大家
- 4、JavaScript:如何使用Console.log()輸出對象信息
- 5、javascript的console.log怎麼用
console.log()是什麼意思?
除了一些很老版本的瀏覽器,現今大多數瀏覽器都自帶調試功能;即使沒有調試功能,也可以通過安裝插件來進行補充。
比如,老版本的Firefox沒有自帶調試工具,在這種情況下可以通過安裝Firebug插件來添加調試功能。在具備調試功能的瀏覽器上,window對象中會註冊一個名為console的成員變數,指代調試工具中的控制台。通過調用該console對象的log()函數,可以在控制台中列印信息。
console.log()可以接受任何字元串、數字和JavaScript對象。與alert()函數類似,console.log()也可以接受換行符\n以及製表符\t。console.log()語句所列印的調試信息可以在瀏覽器的調試控制台中看到。不同的瀏覽器中console.log()行為可能會有所不同。
console.log()的作用
主要是方便調式javascript用的,可以看到在頁面中輸出的內容,與alert相比,它能看到結構化的東西,而alert淡出一個對象就是[obujct object],但comsole能看到對象的內容,console不會打斷頁面的操作。
相比alert他的優點是:
1、他能看到結構話的東西,如果是alert,淡出一個對象就是object object,但是console能看到對象的內容。
2、console不會打斷你頁面的操作,如果用alert彈出來內容,那麼頁面就死了,但是console輸出內容後你頁面還可以正常操作。
3、console裡面的內容非常豐富,你可以在控制台輸入console,然後就可看到。
相關內容:
比如,老版本的Firefox沒有自帶調試工具,在這種情況下可以通過安裝Firebug插件來添加調試功能。在具備調試功能的瀏覽器上,window對象中會註冊一個名為console的成員變數,指代調試工具中的控制台。通過調用該console對象的log()函數,可以在控制台中列印信息。
console.log()可以接受任何字元串、數字和JavaScript對象。與alert()函數類似,console.log()也可以接受換行符\n以及製表符\t。console.log()語句所列印的調試信息可以在瀏覽器的調試控制台中看到。不同的瀏覽器中console.log()行為可能會有所不同。
javascript 中的console.log有什麼作用啊?是做什麼的呢?謝謝大家
大家都有用過各種類型的瀏覽器,每種瀏覽器都有自己的特色,本人拙見,在我用過的瀏覽器當中,我是最喜歡Chrome的,因為它對於調試腳本及前端設計調試都有它比其它瀏覽器有過之而無不及的地方。可能大家對console.log會有一定的了解,心裡難免會想調試的時候用alert不就行了,幹嘛還要用console.log這麼一長串的字元串來替代alert輸出信息呢,下面我就介紹一些調試的入門技巧,讓你愛上console.log
先的簡單介紹一下chrome的控制台,打開chrome瀏覽器,按f12就可以輕鬆的打開控制台
大家可以看到控制台裡面有一首詩還有其它信息,如果想清空控制台,可以點擊左上角那個來清空,當然也可以通過在控制台輸入console.clear()來實現清空控制台信息。如下圖所示
現在假設一個場景,如果一個數組裡面有成百上千的元素,但是你想知道每個元素具體的值,這時候想想如果你用alert那將是多慘的一件事情,因為alert阻斷線程運行,你不點擊alert框的確定按鈕下一個alert就不會出現。
下面我們用console.log來替換,感受一下它的魅力。
看了上面這張圖,是不是認識到log的強大之處了,下面我們來看看console裡面具體提供了哪些方法可以供我們平時調試時使用。
目前控制台方法和屬性有:
[“$$”, “$x”, “dir”, “dirxml”, “keys”, “values”, “profile”, “profileEnd”, “monitorEvents”, “unmonitorEvents”, “inspect”, “copy”, “clear”, “getEventListeners”, “undebug”, “monitor”, “unmonitor”, “table”, “$0”, “$1”, “$2”, “$3”, “$4”, “$_”]
下面我們來一一介紹一下各個方法主要的用途。
一般情況下我們用來輸入信息的方法主要是用到如下四個
1、console.log 用於輸出普通信息
2、console.info 用於輸出提示性信息
3、console.error用於輸出錯誤信息
4、console.warn用於輸出警示信息
5、console.debug用於輸出調試信息
用圖來說話
console對象的上面5種方法,都可以使用printf風格的佔位符。不過,佔位符的種類比較少,只支持字元(%s)、整數(%d或%i)、浮點數(%f)和對象(%o)四種。
console.log(“%d年%d月%d日”,2011,3,26);console.log(“圓周率是%f”,3.1415926);
%o佔位符,可以用來查看一個對象內部情況
var dog = {};dog.name = “大毛”;dog.color = “黃色”;console.log(“%o”, dog);
6、console.dirxml用來顯示網頁的某個節點(node)所包含的html/xml代碼
body
table id=”mytable”
tr
tdA/td
tdA/td
tdA/td
/tr
tr
tdbbb/td
tdaaa/td
tdccc/td
/tr
tr
td111/td
td333/td
td222/td
/tr
/table
/body
script type=”text/javascript”
window.onload = function () {
var mytable = document.getElementById(『mytable『);
console.dirxml(mytable);
}
/script
7、console.group輸出一組信息的開頭
8、console.groupEnd結束一組輸出信息
看你需求選擇不同的輸出方法來使用,如果上述四個方法再配合group和groupEnd方法來一起使用就可以輸入各種各樣的不同形式的輸出信息。
JavaScript:如何使用Console.log()輸出對象信息
有兩種寫法:
第一種:
console.log(‘my object:’, obj);
第二種:
分開寫
console.log(『my object:’);
console.log(obj);
如果使用console.log(』my object:』+obj);就會出現問題中的那種錯誤,這是因為+是用於拼接字元串的,而此時對象的結構語法顯示。
javascript的console.log怎麼用
console.log(要輸出的對象);結果會在瀏覽器控制台顯示。如:console.log(“測試”);運行頁面時會在頁面控制台輸出「測試」二字。
原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-tw/n/256973.html