{"id":5465,"date":"2010-02-02T09:17:10","date_gmt":"2010-02-02T16:17:10","guid":{"rendered":"http:\/\/css-tricks.com\/?page_id=5465"},"modified":"2011-11-10T11:38:39","modified_gmt":"2011-11-10T18:38:39","slug":"error-free-firebug-logging","status":"publish","type":"page","link":"https:\/\/css-tricks.com\/snippets\/javascript\/error-free-firebug-logging\/","title":{"rendered":"Error-Free Console Logging"},"content":{"rendered":"<pre><code class=\"javascript\">var Fb = {}; \/\/An empty object literal for holding the function\r\nFb.log = function(obj, consoleMethod) {\r\n       if (window.console &amp;&amp; window.console.firebug &amp;&amp; window.console.firebug.replace(\/^\\s\\s*\/, '').replace(\/\\s\\s*$\/, '') !== '') {\r\n               if (typeof consoleMethod === \"string\" &amp;&amp; typeof console[consoleMethod] === \"function\") {\r\n                       console[consoleMethod](obj);\r\n               } else {\r\n                       console.log(obj);\r\n               }\r\n       }\r\n}<\/code><\/pre>\n<p>If you leave console.log, console.info, etc messages in your JavaScript code and open the page in browser like IE then it may halt the page loading completely saying that &#8216;console not defined&#8217; especially if your user uses a non IE8 browser.<\/p>\n<p>This code snippet will allow you to leave the logging message as such in your code if you wish and your page will render properly in IE or any other browser that does not support the console messages.<\/p>\n<h4>Usage<\/h4>\n<pre><code class=\"javascript\">Fb.log(\"This will be logged\");\r\n\r\nFb.log(\"This will be displayed in console as info\", \"info\");<\/code><\/pre>\n<p>The FB.log function accepts two parameters the first one is the &#8220;item&#8221; that you want to display in the firebug console and the second one is the firebug method that you want to use for the logging, like info, error, etc. If you omit the second parameter the result will be equivalent to console.log()<\/p>\n<h3>Simple log-only way<\/h3>\n<pre rel=\"JavaScript\"><code>function ltc(what) {\r\n       try {\r\n               console.log(what);\r\n       }\r\n       catch (e) {}\r\n       finally {\r\n               return;\r\n       }\r\n}<\/code><\/pre>\n<pre rel=\"JavaScript\"><code>ltc(\"message\");<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>var Fb = {}; \/\/An empty object literal for holding the function Fb.log = function(obj, consoleMethod) { if (window.console &amp;&amp; window.console.firebug &amp;&amp; window.console.firebug.replace(\/^\\s\\s*\/, &#8221;).replace(\/\\s\\s*$\/, &#8221;) !== &#8221;) { if (typeof consoleMethod === &#8220;string&#8221; &amp;&amp; typeof console[consoleMethod] === &#8220;function&#8221;) { console[consoleMethod](obj); } else { console.log(obj); } } } If you leave console.log, console.info, etc messages in [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":3357,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"page-snippet.php","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":""},"tags":[],"acf":[],"jetpack-related-posts":[{"id":17109,"url":"https:\/\/css-tricks.com\/snippets\/javascript\/addeventlistner-polyfill\/","url_meta":{"origin":5465,"position":0},"title":"addEventListener Polyfill","date":"June 5, 2012","format":false,"excerpt":"\/\/ addEventListener polyfill 1.0 \/ Eirik Backer \/ MIT Licence (function(win, doc){ if(win.addEventListener)return; \/\/No need to polyfill function docHijack(p){var old = doc[p];doc[p] = function(v){return addListen(old(v))}} function addEvent(on, fn, self){ return (self = this).attachEvent('on' + on, function(e){ var e = e || win.event; e.preventDefault = e.preventDefault || function(){e.returnValue = false} e.stopPropagation\u2026","rel":"","context":"With 4 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":4293,"url":"https:\/\/css-tricks.com\/snippets\/html\/use-firebug-in-any-browser\/","url_meta":{"origin":5465,"position":1},"title":"Use Firebug in Any Browser","date":"September 29, 2009","format":false,"excerpt":"Just include this script on the site and you'll get a Firebug console that pops up for debugging in any browser. Not quite as full featured but it's still pretty helpful! Remember to remove it when you are done. Bookmarklet Firebug Lite (drag that link to bookmarks bar) Bookmarklet Code\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":149751,"url":"https:\/\/css-tricks.com\/snippets\/javascript\/get-possible-dom-events\/","url_meta":{"origin":5465,"position":2},"title":"Get All Possible DOM Events","date":"September 11, 2013","format":false,"excerpt":"You can get an array of all the events that start with \"on\" (e.g. onclick) by running this in the Console of Firefox. [i for(i in document)].filter(function(i){return i.substring(0,2)=='on'&&(document[i]==null||typeof document[i]=='function');}) You'll get an array like this (Firefox 23): [\"onreadystatechange\", \"onmouseenter\", \"onmouseleave\", \"onwheel\", \"oncopy\", \"oncut\", \"onpaste\", \"onbeforescriptexecute\", \"onafterscriptexecute\", \"onabort\", \"oncanplay\", \"oncanplaythrough\", \"onchange\",\u2026","rel":"","context":"With 4 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":15825,"url":"https:\/\/css-tricks.com\/snippets\/javascript\/async-script-loader-with-callback\/","url_meta":{"origin":5465,"position":3},"title":"Async Script Loader with Callback","date":"January 3, 2012","format":false,"excerpt":"var Loader = function () { } Loader.prototype = { require: function (scripts, callback) { this.loadCount = 0; this.totalRequired = scripts.length; this.callback = callback; for (var i = 0; i < scripts.length; i++) { this.writeScript(scripts[i]); } }, loaded: function (evt) { this.loadCount++; if (this.loadCount == this.totalRequired && typeof this.callback ==\u2026","rel":"","context":"With 15 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3839,"url":"https:\/\/css-tricks.com\/snippets\/jquery\/target-only-external-links\/","url_meta":{"origin":5465,"position":4},"title":"Target Only External Links","date":"September 4, 2009","format":false,"excerpt":"Technique #1 $('a').filter(function() { return this.hostname && this.hostname !== location.hostname; }).addClass(\"external\"); Technique #2 $.expr[':'].external = function(obj) { return !obj.href.match(\/^mailto\\:\/) && (obj.hostname != location.hostname); }; $('a:external').addClass('external'); Technique #3 $('a:not([href^=\"http:\/\/your-website.com\"]):not([href^=\"#\"]):not([href^=\"\/\"])').addClass('external'); Technique #4 $('a').each(function() { var a = new RegExp('\/' + window.location.host + '\/'); if (!a.test(this.href)) { \/\/ This is an external link\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":196692,"url":"https:\/\/css-tricks.com\/snippets\/javascript\/cross-browser-dependency-free-dom-ready\/","url_meta":{"origin":5465,"position":5},"title":"Cross-Browser Dependency-Free DOM Ready","date":"February 24, 2015","format":false,"excerpt":"Denis Ciccale's version: var DOMReady = function(a, b, c) { b = document c = 'addEventListener' b[c] ? b[c]('DocumentContentLoaded', a) : window.attachEvent('onload', a) } DOMReady(function () { alert('The DOM is Ready!'); }); Minimized: var DOMReady = function(a,b,c){b=document,c='addEventListener';b[c]?b[c]('DOMContentLoaded',a):window.attachEvent('onload',a)} Dustin Diaz's version: function r(f){\/in\/.test(document.readyState)?setTimeout('r('+f+')',9):f()} He also had a repo for it where\u2026","rel":"","context":"With 3 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/5465"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=5465"}],"version-history":[{"count":4,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/5465\/revisions"}],"predecessor-version":[{"id":14909,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/5465\/revisions\/14909"}],"up":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/3357"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=5465"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=5465"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}