<?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>潔靜精微 &#187; debug</title>
	<atom:link href="http://julabs.me/blog/tags/debug/feed/" rel="self" type="application/rss+xml" />
	<link>http://julabs.me/blog</link>
	<description>想努力创造完美的东西，必须具备心灵的纯洁，同时富于宗教精神。</description>
	<lastBuildDate>Wed, 18 Jan 2012 06:34:33 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.4</generator>
		<item>
		<title>用Flashbug调试Flash</title>
		<link>http://julabs.me/blog/flash/debug-flash-with-flashbug/</link>
		<comments>http://julabs.me/blog/flash/debug-flash-with-flashbug/#comments</comments>
		<pubDate>Sat, 19 Jun 2010 00:52:44 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Flash]]></category>
		<category><![CDATA[debug]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[flex]]></category>

		<guid isPermaLink="false">http://julabs.me/blog/?p=217</guid>
		<description><![CDATA[Flashbug是一款基于FireBug的火狐插件，这给利用Flex SDK开发程序的人带来了便利。以前只能用FDB命令行来调试，现在有了Flashbug就更直观了。 安装Flashbug也非常方便,不过要先给火狐安装FireBug插件，还得给火狐安装Debug版本的Flash播放器。 在实际操作中还要注意两点： 一、在编译生成swf文件时，要输出成debug版本的文件，如下命令： D:\flex4\bin\mxmlc.exe -debug=true --strict=true main.mxml 注意里面-debug=true，加了这一段就能输出debug版本的swf文件。 二、要把生成的swf文件嵌入到HTML文件中，不能用浏览器直接打开swf文件，否则Flashbug会失效。 Flashbug的使用很简单，打开FireBug，切换到Flash Console标签，在Trace Log里就能看到在Flash文件中通过trace方法输出的信息，还能查看Shared Objects的信息。 但Flashbug只能输出字符串信息，当要输出类型为Object对象的信息时，它只会输出[object Object]。如果仍然想查看Object对象的信息，就要用到ActionScript中的ExternalInterface方法，通过这个方法来调用FireBug的console.log命令，输出对象的信息，这和调试JavaScript的方式是一样的。下面为实例代码： var newObj:Object = new Object(); newObj.url = 'julabs.me'; flash.external.ExternalInterface.call("console.log",newObj); flash.external.ExternalInterface.call("console.log",['aa','bbb','ccc']); Flashbug一个非常有用的功能就是能够查看AMF信息，查看方法和AJAX的方法一样，在FireBug中切换到网络标签，在所有栏中查找Flash请求的地址。点击这个地址，你会发现下面多出了一个AMF标签，点击它就能查看AMF信息了。如下图所示： 另外还有一个基于FireBug的插件——FlashFirebug，功能更强大，但使用比较复杂。]]></description>
			<content:encoded><![CDATA[<p><a href="http://blog.coursevector.com/flashbug" target="_blank">Flashbug</a>是一款基于<a href="http://getfirebug.com/" target="_blank">FireBug</a>的<a href="http://www.mozillaonline.com/" target="_blank">火狐</a>插件，这给利用<a href="http://www.adobe.com/products/flex/" target="_blank">Flex SDK</a>开发程序的人带来了便利。以前只能用<strong>FDB</strong>命令行来调试，现在有了<strong>Flashbug</strong>就更直观了。</p>
<p>安装<a href="http://blog.coursevector.com/flashbug" target="_blank">Flashbug</a>也非常方便,不过要先给<a href="http://www.mozillaonline.com/" target="_blank">火狐</a>安装<a href="http://getfirebug.com/" target="_blank">FireBug</a>插件，还得给<a href="http://www.mozillaonline.com/" target="_blank">火狐</a>安装<a href="http://www.adobe.com/support/flashplayer/downloads.html" target="_blank">Debug版本的Flash播放器</a>。</p>
<p>在实际操作中还要注意两点：</p>
<p>一、在编译生成<strong>swf</strong>文件时，要输出成<strong>debug</strong>版本的文件，如下命令：</p>
<pre><code class="dos">D:\flex4\bin\mxmlc.exe -debug=true --strict=true main.mxml</code></pre>
<p>注意里面<strong>-debug=true</strong>，加了这一段就能输出<strong>debug</strong>版本的<strong>swf</strong>文件。</p>
<p>二、要把生成的<strong>swf</strong>文件嵌入到HTML文件中，不能用浏览器直接打开<strong>swf</strong>文件，否则<a href="http://blog.coursevector.com/flashbug" target="_blank">Flashbug</a>会失效。</p>
<p><a href="http://blog.coursevector.com/flashbug" target="_blank">Flashbug</a>的使用很简单，打开<a href="http://getfirebug.com/" target="_blank">FireBug</a>，切换到<strong>Flash Console</strong>标签，在<strong>Trace Log</strong>里就能看到在Flash文件中通过<code>trace</code>方法输出的信息，还能查看<strong>Shared Objects</strong>的信息。</p>
<p class="img"><img width="486" height="116" alt="Flashbug" src="/blog/img/10/flashbug01.jpg" /></p>
<p><span id="more-217"></span></p>
<p>但<a href="http://blog.coursevector.com/flashbug" target="_blank">Flashbug</a>只能输出字符串信息，当要输出类型为<strong>Object</strong>对象的信息时，它只会输出<strong>[object Object]</strong>。如果仍然想查看<strong>Object</strong>对象的信息，就要用到<strong>ActionScript</strong>中的<strong>ExternalInterface</strong>方法，通过这个方法来调用<a href="http://getfirebug.com/" target="_blank">FireBug</a>的<strong>console.log</strong>命令，输出对象的信息，这和调试<strong>JavaScript</strong>的方式是一样的。下面为实例代码：</p>
<pre><code class="java">var newObj:Object = new Object();
newObj.url = 'julabs.me';
flash.external.ExternalInterface.call("console.log",newObj);
flash.external.ExternalInterface.call("console.log",['aa','bbb','ccc']);
</code></pre>
<p class="img"><img width="433" height="102" alt="debug flash with firebug" src="/blog/img/10/flashbug02.jpg" /></p>
<p><a href="http://blog.coursevector.com/flashbug" target="_blank">Flashbug</a>一个非常有用的功能就是能够查看<acronym title="Action Message Format">AMF</acronym>信息，查看方法和<acronym title="Asynchronous JavaScript and XML">AJAX</acronym>的方法一样，在<a href="http://getfirebug.com/" target="_blank">FireBug</a>中切换到<strong>网络</strong>标签，在<strong>所有</strong>栏中查找Flash请求的地址。点击这个地址，你会发现下面多出了一个<strong>AMF</strong>标签，点击它就能查看<strong>AMF</strong>信息了。如下图所示：</p>
<p class="img"><img width="500" height="323" alt="flashbug" src="/blog/img/10/flashbug03.jpg" /></p>
<p>另外还有一个基于FireBug的插件——<a href="http://www.o-minds.com/products/flashfirebug" target="_blank">FlashFirebug</a>，功能更强大，但使用比较复杂。</p>
]]></content:encoded>
			<wfw:commentRss>http://julabs.me/blog/flash/debug-flash-with-flashbug/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>IE下的Firebug——IE WebDeveloper</title>
		<link>http://julabs.me/blog/front/ie-plugin-webdeveloper/</link>
		<comments>http://julabs.me/blog/front/ie-plugin-webdeveloper/#comments</comments>
		<pubDate>Sun, 27 Dec 2009 07:45:06 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[前端]]></category>
		<category><![CDATA[debug]]></category>
		<category><![CDATA[developer]]></category>
		<category><![CDATA[ie]]></category>
		<category><![CDATA[plugin]]></category>
		<category><![CDATA[tool]]></category>

		<guid isPermaLink="false">http://julabs.me/blog/?p=17</guid>
		<description><![CDATA[不久之前，在IE下的调试工具我只知道IE Developer Toolbar和Companion.JS，我想这两个工具在IE环境下的功能已经很强大了。但后来在豆瓣的javascript小组中看到了这篇话题——《IE下javascript debug 工具》，其中有个组员推荐了一款IE下功能超强的调试器：IE WebDeveloper，它的功能可以和火狐下的Firebug相媲美，甚至有些功能还强于Firebug。 安装了IE WebDeveloper后会在IE头部的工具栏中出现一个图标，如下图： 点开后就能使用IE WebDeveloper了。IE WebDeveloper有五个主窗口，首先是Webpage Inspector。Webpage Inspector左边是DOM查看器，选择一个DOM节点会在右侧对应地显示其属性值、HTML代码和CSS样式列表。在Webpage Inspector中可以动态地修改DOM结点，IE窗口会实时渲染展示出修改后的结果。（Firebug也有此功能） 第二个为Script Console，这个窗口可以输出页面的一些信息，如错误信息，还能寻址到出错代码的位置。可以在Javascript代码中用console.log('信息')来输出信息了，比alert命令好用多了。还可以直接在里面输入命令进行调试。（Firebug也有此功能） 第三个为Source Explorer，查看当前页所用到CSS和Javascript文件以及HTML源代码，它能够列出Javascript文件中的函数和变量名称。 第四个为Event Log，它能够查看网页浏览器、HTML文档、HTML窗口或所选HTML元素结点的事件触发列表。 最后一个为HTTP Monitor，它可以查看和网络服务器相交互的HTTP信息，相当于Firebug的网络（net）功能，对于AJAX开发很有帮助。 在最后还有人推荐了一个Javascript Debug Toolkit，不过需要eclipse支持，是位国人开发的，感兴趣的朋友可以看看。]]></description>
			<content:encoded><![CDATA[<p>不久之前，在IE下的调试工具我只知道<a href="http://www.microsoft.com/downloadS/details.aspx?familyid=E59C3964-672D-4511-BB3E-2D5E1DB91038&amp;displaylang=en" title="Internet Explorer Developer Toolbar" target="_blank">IE Developer Toolbar</a>和<a href="http://www.my-debugbar.com/wiki/CompanionJS/HomePage" title="Companion.JS" target="_blank">Companion.JS</a>，我想这两个工具在IE环境下的功能已经很强大了。但后来在<a href="http://www.douban.com/" target="_blank">豆瓣</a>的<a href="http://www.douban.com/group/second.life/" target="_blank">javascript小组</a>中看到了这篇话题——<a href="http://www.douban.com/group/topic/2090597/" target="_blank">《IE下javascript debug 工具》</a>，其中有个组员推荐了一款IE下功能超强的调试器：<a href="http://www.ieinspector.com/dominspector/" title="IE WebDeveloper" target="_blank">IE WebDeveloper</a>，它的功能可以和火狐下的<a href="http://getfirebug.com/" title="Firebug" target="_blank">Firebug</a>相媲美，甚至有些功能还强于<a href="http://getfirebug.com/" title="Firebug" target="_blank">Firebug</a>。</p>
<p>安装了<a href="http://www.ieinspector.com/dominspector/" title="IE WebDeveloper" target="_blank">IE WebDeveloper</a>后会在IE头部的工具栏中出现一个图标，如下图：</p>
<p class="img"><img src="http://www.julabs.com/blog/img/09/ie_webdeveloper.png" width="32" height="30" alt="IE WebDeveloper 图标" /></p>
<p>点开后就能使用<a href="http://www.ieinspector.com/dominspector/" title="IE WebDeveloper" target="_blank">IE WebDeveloper</a>了。<a href="http://www.ieinspector.com/dominspector/" title="IE WebDeveloper" target="_blank">IE WebDeveloper</a>有五个主窗口，首先是<strong>Webpage Inspector</strong>。<strong>Webpage Inspector</strong>左边是DOM查看器，选择一个DOM节点会在右侧对应地显示其属性值、HTML代码和CSS样式列表。在<strong>Webpage Inspector</strong>中可以动态地修改DOM结点，IE窗口会实时渲染展示出修改后的结果。（<a href="http://getfirebug.com/" title="Firebug" target="_blank">Firebug</a>也有此功能）</p>
<p><span id="more-17"></span></p>
<p class="img"><a href="http://www.ieinspector.com/dominspector/images/webpage_inspector_l.gif" target="_blank"><img src="http://www.ieinspector.com/dominspector/images/webpage_inspector_l.gif" width="786" height="594" alt="Webpage Inspector" /></a></p>
<p>第二个为<strong>Script Console</strong>，这个窗口可以输出页面的一些信息，如错误信息，还能寻址到出错代码的位置。可以在Javascript代码中用<code>console.log('信息')</code>来输出信息了，比<code>alert</code>命令好用多了。还可以直接在里面输入命令进行调试。（<a href="http://getfirebug.com/" title="Firebug" target="_blank">Firebug</a>也有此功能）</p>
<p class="img"><a href="http://www.ieinspector.com/dominspector/images/scriptconsole_l.gif" target="_blank"><img src="http://www.ieinspector.com/dominspector/images/scriptconsole_l.gif" width="727" height="562" alt="Script Console" /></a></p>
<p>第三个为<strong>Source Explorer</strong>，查看当前页所用到CSS和Javascript文件以及HTML源代码，它能够列出Javascript文件中的函数和变量名称。</p>
<p class="img"><a href="http://www.ieinspector.com/dominspector/images/sourceexplorer_l.gif" target="_blank"><img src="http://www.ieinspector.com/dominspector/images/sourceexplorer_l.gif" width="768" height="594" alt="Source Explorer" /></a></p>
<p>第四个为<strong>Event Log</strong>，它能够查看网页浏览器、HTML文档、HTML窗口或所选HTML元素结点的事件触发列表。</p>
<p class="img"><a href="http://www.ieinspector.com/dominspector/images/event_log_l.gif" target="_blank"><img src="http://www.ieinspector.com/dominspector/images/event_log_l.gif" width="786" height="594" alt="Event Log" /></a></p>
<p>最后一个为<strong>HTTP Monitor</strong>，它可以查看和网络服务器相交互的HTTP信息，相当于<a href="http://getfirebug.com/" title="Firebug" target="_blank">Firebug</a>的<a href="http://getfirebug.com/net.html" title="网络（net）" target="_blank">网络（net）</a>功能，对于AJAX开发很有帮助。</p>
<p class="img"><a href="http://www.ieinspector.com/dominspector/images/http_monitor_l.gif" target="_blank"><img src="http://www.ieinspector.com/dominspector/images/http_monitor_l.gif" width="803" height="588" alt="HTTP Monitor" /></a></p>
<p>在最后还有人推荐了一个<a href="http://code.google.com/p/jsdt/" target="_blank">Javascript Debug Toolkit</a>，不过需要<a href="http://www.eclipse.org/" target="_blank">eclipse</a>支持，是位国人开发的，感兴趣的朋友可以看看。</p>
]]></content:encoded>
			<wfw:commentRss>http://julabs.me/blog/front/ie-plugin-webdeveloper/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

