<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Jabbering Giraffe &#187; jquery</title>
	<atom:link href="http://happygiraffe.net/blog/tag/jquery/feed/" rel="self" type="application/rss+xml" />
	<link>http://happygiraffe.net/blog</link>
	<description></description>
	<lastBuildDate>Wed, 19 Oct 2011 10:40:06 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
<atom:link rel="hub" href="http://pubsubhubbub.appspot.com"/><atom:link rel="hub" href="http://superfeedr.com/hubbub"/>		<item>
		<title>jQuery Logging</title>
		<link>http://happygiraffe.net/blog/2007/09/26/jquery-logging/</link>
		<comments>http://happygiraffe.net/blog/2007/09/26/jquery-logging/#comments</comments>
		<pubDate>Wed, 26 Sep 2007 19:53:00 +0000</pubDate>
		<dc:creator>Dominic Mitchell</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>

		<guid isPermaLink="false">http://happygiraffe.net/2007/09/26/jquery-logging/</guid>
		<description><![CDATA[I’ve been having a lovely day at work, fiddling with jQuery. I started to come up with some really gnarly selector chains though, and I wondered what nodes they were actually addressing. So, I wrote a tiny jQuery extension that &#8230; <a href="http://happygiraffe.net/blog/2007/09/26/jquery-logging/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>I’ve been having a lovely day at work, fiddling with jQuery.  I started to come up with some really gnarly selector chains though, and I wondered what nodes they were actually addressing.</p>
<p>So, I wrote a tiny jQuery extension that logs the current jQuery selection to <a href="http://getfirebug.com/console.html">the firebug console</a>.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">  jQuery.<span style="color: #660066;">fn</span>.<span style="color: #660066;">log</span> <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span> <span style="color: #009900;">&#40;</span>msg<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
      console.<span style="color: #660066;">log</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;%s: %o&quot;</span><span style="color: #339933;">,</span> msg<span style="color: #339933;">,</span> <span style="color: #000066; font-weight: bold;">this</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
      <span style="color: #000066; font-weight: bold;">return</span> <span style="color: #000066; font-weight: bold;">this</span><span style="color: #339933;">;</span>
  <span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span></pre></div></div>

<p>Now, I can just stuff a call to <code>.log()</code> in the middle of what I’m doing to see what I’m currently addressing.  e.g.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">  $<span style="color: #009900;">&#40;</span>root<span style="color: #009900;">&#41;</span>.<span style="color: #660066;">find</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'li.source &gt; input:checkbox'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">log</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;sources to uncheck&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">removeAttr</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;checked&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p>The nice thing about logging to firebug is that each node becomes clickable in the console, so you can immediately see the context.</p>
]]></content:encoded>
			<wfw:commentRss>http://happygiraffe.net/blog/2007/09/26/jquery-logging/feed/</wfw:commentRss>
		<slash:comments>25</slash:comments>
		</item>
	</channel>
</rss>

