Câu trả lời:
Đây không phải là một tính năng của jQuery mà là một tính năng cho mục đích gỡ lỗi. Ví dụ, bạn có thể đăng nhập một cái gì đó vào bàn điều khiển khi có điều gì đó xảy ra. Ví dụ:
$('#someButton').click(function() {
console.log('#someButton was clicked');
// do something
});
Sau đó, bạn sẽ thấy #someButton was clicked
trong tab Bảng điều khiển Bảng điều khiển của Firebird (hoặc bảng điều khiển của công cụ khác - ví dụ: Trình kiểm tra web của Chrome) khi bạn nhấp vào nút.
Vì một số lý do, đối tượng console có thể không khả dụng. Sau đó, bạn có thể kiểm tra xem nó có hữu ích không - điều này rất hữu ích vì bạn không phải xóa mã gỡ lỗi khi triển khai vào sản xuất:
if (window.console && window.console.log) {
// console is available
}
if (console.log)
(hoặc thậm chí if (console && console.log)
) vẫn sẽ đưa ra lỗi nếu bảng điều khiển không khả dụng. Bạn nên sử dụng window.console
(như window
được đảm bảo tồn tại) và chỉ kiểm tra một cấp độ sâu tại một thời điểm.
Những nơi bạn có thể xem giao diện điều khiển! Chỉ cần có tất cả trong một câu trả lời.
Firefox
(hiện tại bạn cũng có thể sử dụng các công cụ dành cho nhà phát triển được tích hợp sẵn của Firefox Ctrl + Shift + J (Công cụ> Nhà phát triển web> Bảng điều khiển lỗi), nhưng Fireorms tốt hơn nhiều; sử dụng Fireorms)
Safari và Chrome
Về cơ bản là giống nhau.
https://developers.google.com/chrome-developer-tools/docs/overview
https://developer.apple.com/technology/safari/developer-tools.html
trình duyệt web IE
Đừng quên bạn có thể sử dụng các chế độ tương thích để gỡ lỗi IE7 và IE8 trong IE9 hoặc IE10
http://msdn.microsoft.com/en-us/l Library /ie / gg589507 (v = vs85) .aspx
http://msdn.microsoft.com/en-us/l Library / dd565628 (v = vs85) .aspx
Nếu bạn phải truy cập bảng điều khiển trong IE6 cho IE7, hãy sử dụng bookmarklet Fireorms Lite
http://getfireorms.com/fireormslite/ tìm bookmarklet ổn định
http://en.wikipedia.org/wiki/Bookmarklet
Opera
http://www.opera.com/dragonfly/
iOS
Hoạt động cho tất cả iPhone, iPod touch và iPad.
Giờ đây với iOS 6, bạn có thể xem bảng điều khiển thông qua Safari trong OS X nếu bạn cắm thiết bị của mình. Hoặc bạn có thể làm như vậy với trình giả lập, chỉ cần mở cửa sổ trình duyệt Safari và chuyển đến tab "Phát triển". Ở đó bạn sẽ tìm thấy các tùy chọn để yêu cầu trình kiểm tra Safari liên lạc với thiết bị của bạn.
Điện thoại Windows, Android
Cả hai đều không có giao diện điều khiển tích hợp và không có khả năng bookmarklet. Vì vậy, chúng tôi sử dụng http://jsconsole.com/ type: lắng nghe và nó sẽ cung cấp cho bạn thẻ script để đặt vào HTML của bạn. Từ đó trở đi, bạn có thể xem bảng điều khiển của mình bên trong trang web jsconsole.
iOS và Android
Bạn cũng có thể sử dụng http://html.adobe.com/edge/inspect/ để truy cập các công cụ kiểm tra web và bảng điều khiển trên bất kỳ thiết bị nào bằng cách sử dụng plugin trình duyệt tiện lợi của chúng.
Sự cố trình duyệt cũ hơn
Các phiên bản IE cũ hơn sẽ bị sập nếu bạn sử dụng console.log trong mã của mình và không mở các công cụ dành cho nhà phát triển cùng một lúc. May mắn thay, đó là một sửa chữa dễ dàng. Sử dụng đoạn mã dưới đây ở đầu mã của bạn:
if(!window.console){ window.console = {log: function(){} }; }
Cái này kiểm tra xem bàn điều khiển có mặt không, và nếu không nó sẽ đặt nó vào một đối tượng có chức năng trống được gọi log
. Cách này window.console và window.console.log không bao giờ thực sựundefined.
Bạn có thể xem bất kỳ tin nhắn nào được ghi vào bảng điều khiển nếu bạn sử dụng một công cụ như Fireorms để kiểm tra mã của mình. Hãy nói rằng bạn làm điều này:
console.log('Testing console');
Khi bạn truy cập vào bảng điều khiển trong Fireorms (hoặc bất kỳ công cụ nào bạn quyết định sử dụng để kiểm tra mã của mình), bạn sẽ thấy bất kỳ thông báo nào bạn đã nói với chức năng để đăng nhập. Điều này đặc biệt hữu ích khi bạn muốn xem liệu một hàm đang thực thi hay nếu một biến được truyền / gán đúng. Nó thực sự khá có giá trị để tìm ra những gì đã xảy ra với mã của bạn.
Nó sẽ đăng một thông điệp tường trình lên bảng điều khiển javascript của trình duyệt, ví dụ Firebird hoặc Công cụ dành cho nhà phát triển (Chrome / Safari) và sẽ hiển thị dòng và tệp nơi nó được thực thi.
Hơn nữa, khi bạn xuất đối tượng jQuery, nó sẽ bao gồm một tham chiếu đến phần tử đó trong DOM và nhấp vào nó sẽ đi đến phần tử đó trong tab Các yếu tố / HTML.
Bạn có thể sử dụng nhiều phương pháp khác nhau, nhưng hãy cẩn thận để nó hoạt động trong Firefox, bạn phải mở Firebird, nếu không toàn bộ trang sẽ bị sập. Cho dù những gì bạn đang đăng nhập là một biến, mảng, đối tượng hoặc phần tử DOM, nó sẽ cung cấp cho bạn toàn bộ phân tích bao gồm cả nguyên mẫu cho đối tượng (luôn luôn thú vị để chọc ngoáy). Bạn cũng có thể bao gồm nhiều đối số như bạn muốn và chúng sẽ được thay thế bằng khoảng trắng.
console.log( myvar, "Logged!");
console.info( myvar, "Logged!");
console.warn( myvar, "Logged!");
console.debug(myvar, "Logged!");
console.error(myvar, "Logged!");
Chúng hiển thị với các logo khác nhau cho mỗi lệnh.
Bạn cũng có thể sử dụng console.profile(profileName);
để bắt đầu cấu hình một chức năng, tập lệnh, v.v. Sau đó kết thúc nó console.profileEnd(profileName);
và nó sẽ hiển thị trong tab Hồ sơ của bạn trong Chrome (không biết với FF).
Để tham khảo đầy đủ, hãy truy cập http://getfireorms.com/logging và tôi khuyên bạn nên đọc nó. (Dấu vết, nhóm, hồ sơ, kiểm tra đối tượng).
Hi vọng điêu nay co ich!
console.log("x:", x)
tốt hơn console.log("x:" + x)
? Có phải nó ít bị lỗi hơn vì a ,
dễ đọc hơn a +
?
+
nghiêm ngặt, nhưng tôi muốn chứng minh rằng bạn cũng có thể sử dụng dấu phẩy trong các chức năng của bàn điều khiển. Ngoài ra, nó tránh các vấn đề nếu cả hai biến là số nguyên hoặc mảng.
console.log("x:", x)
tốt hơn đáng kể, bởi vì khi x
là đối tượng hoặc mảng (hoặc bất cứ thứ gì trừ chuỗi), nó sẽ được hiển thị chính xác, không cần chuyển đổi thành chuỗi.
Không có gì để làm với jQuery và nếu bạn muốn sử dụng nó, tôi khuyên bạn nên làm
if (window.console) {
console.log("your message")
}
Vì vậy, bạn không phá vỡ mã của bạn khi nó không có sẵn.
Theo đề xuất trong bình luận, bạn cũng có thể thực hiện điều đó ở một nơi và sau đó sử dụng console.log
như bình thường
if (!window.console) { window.console = { log: function(){} }; }
if(!window.console){ window.console = function(){}; }
ở một nơi, sau đó sử dụng console.log như bình thường.
console.log
ghi nhật ký thông tin gỡ lỗi vào bảng điều khiển trên một số trình duyệt (Firefox đã cài đặt Fireorms, Chrome, IE8, bất cứ thứ gì có cài đặt Fireorms Lite). Trên Firefox, nó là một công cụ rất mạnh, cho phép bạn kiểm tra các đối tượng hoặc kiểm tra bố cục hoặc các thuộc tính khác của các phần tử HTML. Nó không liên quan đến jQuery, nhưng có hai điều thường được thực hiện khi sử dụng nó với jQuery:
cài đặt tiện ích mở rộng FireQuery cho Fireorms . Điều này, trong số những lợi thế khác, làm cho việc ghi nhật ký của các đối tượng jQuery trông đẹp hơn.
tạo một trình bao bọc phù hợp hơn với các quy ước mã chuỗi của jQuery.
Điều này thường có nghĩa là một cái gì đó như thế này:
$.fn.log = function() {
if (window.console && console.log) {
console.log(this);
}
return this;
}
mà sau đó bạn có thể gọi như
$('foo.bar').find(':baz').log().hide();
để dễ dàng kiểm tra bên trong chuỗi jQuery.
Một điểm khó hiểu đôi khi là để ghi lại một tin nhắn văn bản cùng với nội dung của một trong các đối tượng của bạn bằng console.log, bạn phải chuyển từng một trong hai đối số thành một đối số khác nhau. Điều này có nghĩa là bạn phải phân tách chúng bằng dấu phẩy vì nếu bạn sử dụng toán tử + để nối các đầu ra, thì điều này sẽ gọi .toString()
phương thức của đối tượng của bạn. Điều này trong hầu hết các trường hợp không được ghi đè rõ ràng và việc triển khai mặc định được kế thừa bởi Object
không cung cấp bất kỳ thông tin hữu ích nào.
Ví dụ để thử trong giao diện điều khiển:
>>> var myObj = {foo: 'bar'}
undefined
>>> console.log('myObj is: ', myObj);
myObj is: Object { foo= "bar"}
trong khi đó nếu bạn cố gắng nối thông điệp văn bản thông tin cùng với nội dung của đối tượng bạn nhận được:
>>> console.log('myObj is: ' + myObj);
myObj is: [object Object]
Vì vậy, hãy nhớ rằng console.log trong thực tế có nhiều đối số như bạn muốn.
Sử dụng console.log
để thêm thông tin gỡ lỗi vào trang của bạn.
Nhiều người sử dụng alert(hasNinjas)
cho mục đích này nhưngconsole.log(hasNinjas)
dễ làm việc hơn. Sử dụng một cảnh báo bật lên một hộp thoại phương thức chặn giao diện người dùng.
Chỉnh sửa: Tôi đồng ý với Baptiste Pernet và Jan Hančič rằng nên kiểm tra xem có window.console
được xác định trước để mã của bạn không bị hỏng nếu không có bảng điều khiển khả dụng.
Một ví dụ - giả sử bạn muốn biết dòng mã nào bạn có thể chạy chương trình của mình (trước khi nó bị hỏng!), Chỉ cần nhập vào
console.log("You made it to line 26. But then something went very, very wrong.")
Bạn sử dụng nó để gỡ lỗi mã JavaScript bằng Firebird cho Firefox hoặc bảng điều khiển JavaScript trong trình duyệt WebKit .
var variable;
console.log(variable);
Nó sẽ hiển thị nội dung của biến, ngay cả khi đó là một mảng hoặc đối tượng.
Nó tương tự như print_r($var);
với PHP .
if (!window.console) { window.console = { log : function() {} }; }
. Điều này cho phép bạn thoát khỏi việc quên xóa câu lệnh gỡ lỗi không thường xuyên.
Chú ý: để lại các cuộc gọi đến bàn điều khiển trong mã sản xuất của bạn sẽ khiến trang web của bạn bị hỏng trong Internet Explorer. Không bao giờ giữ nó mở khóa. Xem: https://web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog
Trong những ngày đầu, việc gỡ lỗi JS được thực hiện thông qua alert()
chức năng - bây giờ nó là một thực tiễn lỗi thời.
Đây console.log()
là một chức năng viết một thông báo để đăng nhập vào bảng điều khiển gỡ lỗi, chẳng hạn như Webkit hoặc Fireorms. Trong trình duyệt, bạn sẽ không thấy bất cứ điều gì trên màn hình. Nó ghi lại một thông điệp đến một bàn điều khiển gỡ lỗi. Nó chỉ khả dụng trong Firefox với Fireorms và trong các trình duyệt dựa trên Webkit (Chrome và Safari). Nó không hoạt động tốt trong tất cả các bản phát hành IE .
Đối tượng giao diện điều khiển là một phần mở rộng cho DOM.
Chỉ console.log()
nên được sử dụng trong mã trong quá trình phát triển và gỡ lỗi.
Nó được coi là thực hành xấu mà ai đó để lại console.log()
trong tệp javascript trên máy chủ sản xuất.
Nếu trình duyệt của bạn hỗ trợ gỡ lỗi, bạn có thể sử dụng phương thức console.log () để hiển thị các giá trị JavaScript.
Kích hoạt gỡ lỗi trong trình duyệt của bạn F12và chọn "Bảng điều khiển" trong menu trình gỡ lỗi.
Bảng điều khiển trong JavaScript. Cố gắng sửa hoặc "gỡ lỗi", một chương trình JavaScript không hoạt động và thực hành sử dụng lệnh console.log (). Có các phím tắt sẽ giúp bạn truy cập vào bảng điều khiển JavaScript, dựa trên trình duyệt mà bạn đang sử dụng:
Phím tắt trên Bàn điều khiển Chrome
Windows: Ctrl+ Shift+ J
Mac: Cmd+ Option+J
Phím tắt bàn điều khiển Firefox
Windows: Ctrl+ Shift+ K
Mac: Cmd+ Option+K
Phím tắt bàn điều khiển Internet Explorer
F12 Chìa khóa
Phím tắt Safari Console
Cmd+ Option+C
console.log
cụ thể là một phương pháp để các nhà phát triển viết mã để thông báo một cách rõ ràng cho các nhà phát triển những gì mã đang làm. Nó có thể được sử dụng để cảnh báo bạn rằng có một vấn đề, nhưng không nên thay thế trình gỡ lỗi tương tác khi đến lúc gỡ lỗi mã. Bản chất không đồng bộ của nó có nghĩa là các giá trị được ghi lại lại không nhất thiết phải đại diện cho giá trị khi phương thức được gọi.
Tóm lại: đăng nhập lỗi với console.log
(nếu có), sau đó sửa lỗi bằng cách sử dụng trình gỡ lỗi mà bạn chọn: Fireorms , WebKit Developer Tools (tích hợp vào Safari và Chrome ), IE Developer Tools hoặc Visual Studio.
Nó được sử dụng để ghi nhật ký (bất cứ thứ gì bạn vượt qua) vào bảng điều khiển Fireorms . Việc sử dụng chính sẽ là gỡ lỗi mã JavaScript của bạn.
Trong các tập lệnh java không có chức năng đầu vào và đầu ra. Vì vậy, để gỡ lỗi phương thức console.log () được sử dụng. Đây là một phương thức để đăng nhập. Nó sẽ được in dưới nhật ký giao diện điều khiển (công cụ phát triển).
Nó không có trong IE8 và dưới cho đến khi bạn mở công cụ phát triển IE.
Điều này không có gì để đối phó với jQuery. Các console.log()
là tham khảo để chức năng đăng nhập giao diện điều khiển của đối tượng, trong đó cung cấp phương pháp để đăng nhập thông tin cho giao diện điều khiển của trình duyệt. Các phương pháp này chỉ nhằm mục đích gỡ lỗi và không nên dựa vào để trình bày thông tin cho người dùng cuối.