lilian :非常棒的插件！要是能将自定义字段的外链也能转成内链就更好了，很多人需要这个功能啊，等大神加入啊！
千杯 :真是充满了岁月痕迹的博客啊……是什么让你这一年里变化这么大，简直是质变啊，量的积累肯定也有吧
千杯 :难得一见做这么久个人博客的人了，膜拜一下，我的域名也快10年了，然而用的时间并不多，相比之下比较惭愧
在IEInternet Explorer Developer ToolFirefox插件FireBug发布之后，Opera终于推出了自己的网站开发工具“蜻蜓（Dragonfly）”。蜻蜓是一款面向网站开发者的插件，它主要用于网站在客户端的调试。Opera作为Internet Explorer和Firefox之后的第三大浏览器，很多网页设计者都在尽可能地使自己的页面在Opera中表现的好看一点，蜻蜓Dragonfly的推出为跨浏览器页面设计带来了便利。
安装：从上面的链接下载到一个Opera9.5b2的安装文件，如果你还没有安装Opera那么直接运行安装，如果你已经安装了Opera，只需运行升级即可。
1、启动和使用，首先你在Opera浏览器中打开你想要进行分析和调试的网页，然后再在菜单栏中点击“工具”，选择“高级”，在弹出的二级菜单中选择“开发者工具”，启动Dragonfly。
2、Dragonfly启动后，我们发现他在布局上左右两栏布局，功能上主要分为script、DOM、Console三项。其中，Sript用于调试Javascript、CSS等脚本，DOM用于调试文档的树结构、Console用于错误控制，如javascript和CSS错误等。
其中在2区内可以调试Javacrip，如设置断点。断点的设置方法很简单，首先在1区中选择脚本文件如common.js，然后在2区就会显示1区脚本的所有内容，现在只要在代码的左侧点击就可以设置断点。断点的作用就是让脚本运行到此时暂停，这样可以通过3区中的Console控制台来获得当前变量的值等，是调试和跟踪脚本的有效方式。
如果我们在第3行a+=i;处设置一个断点，刷新页面后，javascript会在第一个循环处停止，等待调试，这时候如果我们在3区的console输入alert("a=" + a);就会弹出“a=0”；现在我们再按F8或者“continue”，第二次循环至此时，两次停止，这次如果输入alert("a=" + a);，就会弹出"a=1"。依此，我们可以跟踪每次循环后a的值。
这只是一个简单的应用，在处理更加复杂的JS问题时，断点调试相当有帮助。此外上排的按钮还提供了其它功能，
Dragonfly的DOM调试虽然要比Firebug或者Internet Explorer Developer Tools简单一点，但是作为一个Alpha版，他已经具有了很强大的功能。进行DOM选项卡后，在左上区可以查看的引用情况，当前的运行平台信息，如操作系统、浏览器版本等（这对于跨平台、跨浏览器设计都是很重要的信息）。布局和功能上，左侧为DOM结构，右侧为CSS样式表内容。
其中1区为可以调试的页面，如果你的页面中包含了iframe等框架结构，那么可调试页就会有两个或者多个。点击其中的一个，在2区显示DOM结构，在4区显示CSS结构。鼠标单击DOM中的任一节点，在3区会显示该节点的目录层次，并在4区显示该节点上的CSS样式，其中包括直接应用的信息和从父节点上继承的信息，以及继承后又覆盖的信息。
Layout显示的是“盒模型”的相关信息，如果你用鼠标选中其中的任一元素，便会在Layout中显示其width、height、Padding、margin等信息，如下图：
console中显示的主要是页面的相关信息，如你的CSS中使用了hack信息，那么Dragonfly就会认为这些hack技术是非法的CSS语法等
综上，蜻蜓（dragonfly）已经具有了Internet Explorer Developer Tool和Firebug的大部分功能，但是他还不能像前二者那样任意地编辑HTML文件。不过在Beta版或者正式版中，这项功能是一定具备的。此外，dragonfly也不能附着在浏览器上，两个窗口来回切换有时候的确不方便。不过作为一个Alpha版我们已经看到了希望。
Dragonfly的出现令人兴奋，特别是对于网站设计者和开发者来说，从此无论是在Firefox还是Internet Explorer下或者Opera下都不用再为调试伤透脑筋了。直观，高效的开发时代已经来临
Tags:seo以上就是蜻蜓欲飞——Opera网站开发工具蜻蜓（Dragonfly）试用评测的全部内容了，希望大家喜欢。