Firebug and YSlow安装使用

Firebug and YSlow安装使用
Firebug and YSlow安装使用

一、安装:

1.在Firefox下安装Firebug :安装步骤(本人firefox为3.0.4版本):工具-》附加组

件-》获取附加组件-》输入“firebug”进行搜索-》搜索到之后,选择“添加到firefox”-》立即安装-》安装完成后,重新启动一下firefox就可以使用firebug。

2.安装yslow, 安装步骤同上。

标注:编辑请直接看三十五、四十八;美工请看相关段落;开发看全部。

二、从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂

亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业。为帮助广大正处于Web2.0洪流中的开发人员,在这里为大家介绍一款轻巧灵活的辅助开发工具。

三、Firebug是Firefox下的一款开发类插件,现属于Firefox的五星级强力推荐插件之一。

它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体,是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀,从各个不同的角度剖析Web页面内部的细节层面,给Web开发者带来很大的便利。这是一款让人爱不释手的插件,如果你以前没有接触过它,也许在阅读本文之后,会有一试的欲望。笔者在撰写此文的时候,正逢Firebug发布1.0正式版,这不能不说是种巧合。

四、Firebug插件虽然功能强大,但是它已经和Firefox浏览器无缝地结合在一起,使用简单

直观。如果你担心它会占用太多的系统资源,也可以方便地启用/关闭这个插件,甚至针对特定的站点开启这个插件。

五、在安装好插件之后,先用Firefox浏览器打开需要测试的页面,然后点击右下方的绿色

按钮或使用快捷键F12唤出Firebug插件,它会将当前页面分成上下两个框架,如图1所示。

六、图1:Firebug插件展开图示

从图1中看到,Firebug有6个主要的Tab按钮,下文将主要介绍介绍这几方面的功能。

七、Console 控制台

八、控制台能够显示当前页面中的javascript错误以及警告,并提示出错的文件和行号,方

便调试,这些错误提示比起浏览器本身提供的错误提示更加详细且具有参考价值。而且在调试Ajax应用的时候也是特别有用,你能够在控制台里看到每一个XMLHttpRequests 请求post出去的参数、URL,http头以及回馈的内容,原本似乎在幕后黑匣子里运作的程序被清清楚楚地展示在你面前。

九、象C shell或Python shell一样,你还能在控制台中查看变量内容,直接运行javascript

语句,就算是大段的javascript程序也能够正确运行并拿到运行期的信息。

十、控制台还有个重要的作用就是查看脚本的log, 从前你也许习惯了使用alert来打印变量,

但是Firebug给我们带来了一个新朋友—— console.log, 最简单的打印日志的语法是这样的:

十一、console.log("hello world")

十二、如果你有一堆参数需要组合在一起输出,可以写成这样:

十三、console.log(2,4,6,8,"foo",bar).

十四、Firebug的日志输出有多种可选的格式以及语法,甚至可以定制彩色输出,比起单调的alert,显然更加方便,限于篇幅,这里不做详细说明,但是有志于提高debug效率的读者,可以到Firebug的官方站点(见附录)查看更详细的教程。

十五、图2:在控制台里调试javascript

十六、查看和修改HTML

十七、第一次看到Firebug强大的HTML代码查看器,就觉得它与众不同,相比于Firefox 自带的HTML查看器,它的功能强大了许多。HTML

十八、首先你看到的是已经经过格式化的HTML代码,它有清晰的层次,你能够方便地分辨出每一个标签之间的从属并行关系,标签的折叠功能能够帮助你集中精力分析代码。

源代码上方还标记出了DOM的层次,如图3所示,它清楚地列出了一个hml元素的parent、child以及root元素,配合Firebug自带的CSS查看器使用,会给div+css页面分析编写带来很大的好处。你还可以在HTML查看器中直接修改HTML源代码,并在浏览器中第一时间看到修改后的效果,光凭这一点就会让许多页面设计师死心塌地地成为Firebug的粉丝了。

十九、有时候页面中的javascript会根据用户的动作如鼠标的onmouseover来动态改变一些HTML元素的样式表或背景色,HTML查看器会将页面上改变的内容也抓下来,并以黄色高亮标记,让网页的暗箱操作彻底成为历史。

二十、利用Inspect检查功能,我们还可以用鼠标在页面中直接选择一些区块,查看相应的HTML源代码和CSS样式表,真正的做到所见即所得,如果你使用了外部编辑器修改了当前网页,可以点击Firebug的reload图片重新载入网页,它会继续跟踪你之前用Inspect选中的区块,方便调试。

二十一、图3::HTML查看器

二十二、CSS调试

二十三、Firebug的CSS调试器是专为网页设计师们量身定做的。

二十四、如今的网页设计言必称div+css,如果你是用table套出来的HTML页面,就得按这规矩重构一遍,否则显得你不够时髦!用div做出来的页面的确能精简HTML代码,HTML标签减肥的结果就是CSS样式表的编写成了页面制作的重头戏。Firebug的CSS查看器不仅自下向上列出每一个CSS样式表的从属继承关系,还列出了每一个样式在哪个样式文件中定义。你可以在这个查看器中直接添加、修改、删除一些CSS样式表属性,并在当前页面中直接看到修改后的结果。

二十五、一个典型的应用就是页面中的一个区块位置显得有些不太恰当,它需要挪动几个象素。这时候用CSS调试工具可以轻易编辑它的位置——你可以根据需要随意挪动象素。

如图4中正在修改一个区块的背景色。

二十六、提示:如果你正在学习CSS样式表的应用,但是总记不住常用的样式表有哪些值,可以尝试在CSS调试器中选中一个样式表属性,然后用上下方向键来改变它的值,它会把可能的值一个个遍历给你看。

二十七、图4: CSS查看器,能够直接修改样式表

二十八、可视化的CSS尺标

二十九、我们可以利用Firebug来查看页面中某一区块的CSS样式表,如果进一步展开右侧Layout tab的话,它会以标尺的形式将当前区块占用的面积清楚地标识出来,精确到象素,更让人惊讶的是,你能够在这个可视化的界面中直接修改各象素的值,页面上区块的位置就会随改动而变化。在页面中某些元素出现错位或者面积超出预料值时,该功能能够提供有效的帮助,你可以籍此分析offset、margin、padding、size之间的关系,从而找出解决问题的办法。

三十、图5:Firebug中的CSS标尺

三十一、网络状况监视器

三十二、也许有一天,你的老板或者客户找到你,抱怨你制作的网页速度奇慢,你该如何应对?你或许会说这可能是网络问题,或者是电脑配置问题,或者是程序太慢,或者直说是他们的人品问题?不管怎么说,最后你可能被要求去解决这个有多种可能的问题。

三十三、网络状况监视器能帮你解决这个棘手问题。Firebug的网络监视器同样是功能强大的,它能将页面中的CSS、javascript以及网页中引用的图片载入所消耗的时间以矩状图呈现出来,也许在这里你能一把揪出拖慢了你的网页的元凶,进而对网页进行调优,最后老板满意客户欢喜,你的饭碗也因此而牢固。

三十四、网络监视器还有一些其它细节功能,比如预览图片,查看每一个外部文件甚至是xmlHttpRequests请求的http头等等。

三十五、图6:网络状况监视器

三十六、Javascript调试器

三十七、这是一个很不错的javascript脚本调试器,占用空间不大,但是单步调试、设置断点、变量查看窗口一个不少。正所谓麻雀虽小,五脏俱全。

三十八、如果你有一个网站已经建成,然而它的javascript有性能上的问题或者不是太完美,可以通过面板上的Profile来统计每段脚本运行的时间,查看到底是哪些语句执行时间过长,一步步排除问题。

三十九、图7:javascript调试器

四十、DOM查看器

四十一、DOM(Document Object Model)里头包含了大量的Object以及函数、事件,在从前,你要想从中查到需要的内容,绝非易事,这好比你去了一个巨大的图书馆,想要找到几本名字不太确切的小书,众多的选择会让你无所适从。而使用Firebug的DOM

查看器却能方便地浏览DOM的内部结构,帮助你快速定位DOM对象。双击一个DOM 对象,就能够编辑它的变量或值,编辑的同时,你可能会发现它还有自动完成功能,当你输入document.get之后,按下tab键就能补齐为document.getElementById,非常方便。如果你认为补齐得不够理想,按下shift+tab又会恢复原状。用了Firebug的DOM 查看器,你的javascript从此找到了驱使的对象,Web开发也许就成了一件乐事。

四十二、图8: Dom查看器

四十三、小结

四十四、Firebug插件提供了一整套web开发所必需的工具。从HTML的编写,到CSS 样式表的美化调优,以及用javascript脚本开发,亦或是Ajax应用,Firebug插件都会成为你的得力助手。所谓工欲善其事,必先利其器。在Web2.0的时代,言必称Ajax,动辄就是用户体验提升,如果把Firebug工具用好,必能让你如虎添翼,将HTML、CSS、javascript整理得服服帖帖,从此成为web开发中的专家级人物。

四十五、附

四十六、Firebug的中文含义是萤火虫,作者是Joe Hewitt,官方网页

四十八、yslow使用方法更加简单,安装后打开Firebug,点击YSlow选项,如下图:

直接点击“Run Test”,看结果就OK了。

Firebug+Firefox调试方法

在火狐中困扰我大半天的js问题.找到这个. 半小时就搞定了.. .下面是原帖内容. 什么是Firebug 从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript 给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业。为帮助广大正处于Web2.0洪流中的开发人员,在这里为大家介绍一款轻巧灵活的辅助开发工具。 Firebug是Firefox下的一款开发类插件,现属于Firefox 的五星级强力推荐插件之一。它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体,是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀,从各个不同的角度剖析Web页面内部的细节层面,给Web开发者带来很大的便利。这是一款让人爱不释手的插件,如果你以前没有接触过它,也许在阅读本文之后,会有一试的欲望。笔者在撰写此文的时候,正逢Firebug发布1.0正式版,这不能不说是种巧合。 应用 Firebug插件虽然功能强大,但是它已经和Firefox浏览器无缝地结合在一起,使用简单直观。如果你担心它会占用太多的系统资源,也可以方便地启用/关闭这个插件,甚至针对特定的站点开启这个插件。 在安装好插件之后,先用Firefox浏览器打开需要测试的页面,然后点击右下方的绿色按钮或使用快捷键F12唤出Firebug插件,它会将当前页面分成上下两个框架,如图1所示。 图1:Firebug插件展开图示 从图1中看到,Firebug有6个主要的Tab按钮,下文将主要介绍介绍这几方面的功能。 Console 控制台 控制台能够显示当前页面中的javascript错误以及警告,并提示出错的文件和行号,方便调试,这些错误提示比起浏览器本身提供的错误提示更加详细且具有参考价值。而且在调试Ajax应用的时候也是特别有用,你能够在控制台里看到每一个XMLHttpRequests请求post出去的参数、URL,http头以及回馈的内容,原本似乎在幕后黑匣子里运作的程序被清清楚楚地展示在你面前。

图形组态设计系统使用说明书样本

组态软件设计系统说明 一、配置运行环境 1.1安装tomcat服务器及axis插件 首先需要安装Tomcat服务器(作为web容器, 主要是解析和运行jsp), 在安装Tomcat之前, 先要确定主机上是否有java环境, 如果没有则应该先安装jdk( 这个能够直接在网上下载到) , 根据安装提示安装完Tomcat之后, 要确认是否安装成功, 即启动Tomcat, 然后在网页地址栏输入http://localhost:8080( 注意这里的8080是在安装过程中所选择的端口号)如果出现Tomcat主页, 则说明安装成功。在网上下载个axis插件axis.war 文件, 放在Tomcat安装路径的webapps子文件下, 重启Tomcat, 同时将服务文件iPowerGraph.aar文件复制到webapps/axis2/WEB-INF/services下。将整个工程iPowerGraph文件拷到webapps子文件下。 新建一个环境变量, 变量名: CATALINA_HOME 变量值: D:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps( 即电脑上安装Tomcat的路径) 改完环境变量后重启电脑, 将iPowerGraph文件拷到Tomcat安装路径下的webapps子文件下, 同时将服务文件iPowerGraph.aar文件复制到webapps/axis2/WEB-INF/services下, 重启Tomcat即可。 1.2安装火狐浏览器( 4.0以下版本) 由于当前各种浏览器对svg矢量图的各种属性支持程度不一致, 在综合考虑之后, 最终选择火狐浏览器作为运行平台。当前实际应用的版本是火狐

有选择删除“我最近打开的文档记录”

龙源期刊网 https://www.360docs.net/doc/244509703.html, 有选择删除“我最近打开的文档记录” 作者:刘长德 来源:《电脑知识与技术·经验技巧》2010年第02期 当我们每次打开电脑,单击“开始”后用鼠标指向“文档”时,都会显示出一大串我们以前打开 过的文档记录,其中包含Word、图片、压缩包、多媒体文件等等(如图1),这就是我们最近打开过的文档记录了。如果是个人电脑也就无所谓了,反正是天知、地知、自己知就行了。那如果 是在公用电脑上,又不想将个人的使用记录暴露于大厅广众之下怎么办?最直接的办法就是一个一个删除了。也可以在任务栏中右击“开始”并选择“属性”,然后在“任务栏和「开始」属性”对话框中,单击“「开始」菜单——自定义”,在“自定义「开始」菜单”对话框中,单击“高级”标签,然后将“列出我最近打开的文档记录”前面的钩去掉,不过这种“斩尽杀绝”的办法的确有点不太民主, 那还有没有其它办法让我们有选择性地来保护个人隐私呢? 一、从文件夹中直接删除 当我们在电脑单击“开始”,用鼠标指向“文档”后,就会显示出一大串最近的文档记录,那么这些文档记录保存在什么地方呢?其实这些文档记录都保存在“C:\Documents and Settings\用户名 \Recent”这个文件夹中,假如我们若想直接从文件夹中删除文档记录,也是可以的,不过“Recent”文件夹默认是隐藏的(如图2),所以在打开“C:\Documents and Settings”文件夹后,还要在菜单栏中单击“工具——文件夹选项”,在打开的“文件夹选项”对话框中,单击“查看”选项卡,然后在“高级”选项组中将“显示所有文件和文件夹”选中,单击“确定”退出,这样就能显示“用户名”文件夹,然后在依次打开“Recent”文件夹后,就能有选择地删除其中的文档记录了。 二、借用Win RAR更方便 因为“Recent”文件夹默认是隐藏的,所以借用Win RAR压缩工具的隐藏文件查看功能,直接打开“Recent”文件夹,再有选择性地删除最近文档记录更简单、方便。首先是单击“开始——程序——WinRAR”,打开WinRAR后,单击菜单栏的“选项——文件夹树——显示磁盘文件夹”,此时即可在对话框左侧以树状显示磁盘文件夹,在树状磁盘文件夹中依次打开“C:\Documents and Settings\用户名\我最近的文档(Recent)”,在右侧对话框中即可显示出所有的“我最近的文档”了,此时,如果文档记录呈不规则状排列,会影响我们寻找“我最近的文档”,我们可以在空白处右键单击鼠标,选择“排序方式”,建议选择以“修改时间”的方式排序,这样,就可以根据打开文档的时间或文

让Windows 7系统菜单显示最近使用的文档

让Windows 7系统菜单显示最近使用的文档 最近小丽购买了预装Win7系统的笔记本,很快就喜欢上了Win7系统漂亮方便的界面、各种灵活实用的工具和强大丰富的功能,同时也体验到了Win7界面和WinXP的一些不同。比如小丽经常会点击WinXP“开始菜单”里“我最近的文档”查看近期打开过的文件记录,而点击Win7系统开始菜单中的“文档”会打开Win7资源管理器中“库”的文档分类。小丽觉得有点不习惯,希望自己Win7系统的开始菜单中也能显示最近使用的文档。 图示:点击Win7系统开始菜单中的“文档”将打开Win7资源管理器中 “库”的文档分类 朋友告诉小丽,Win7系统增加了跳转列表功能,只要用鼠标右键点击任务栏中的程序图标就可以看到该程序曾经打开的文档记录,非常方便。不过如果小丽希望保留自己的Windows系统使用习惯,Win7系统也提供了非常方便灵活的设置功能,想要在Win7开始菜单中显示最近使用的文档实在是易如反掌。 先用鼠标右键点击Win7系统着左下角的圆形“开始”按钮,然后选择“属性”,打开Win7系统“任务栏和开始菜单属性”设置面板。

图示:打开Win7系统“任务栏和开始菜单属性”设置面板 在“任务栏和开始菜单属性”设置面板中选择“开始菜单”选项卡,点击“自定义”按钮。 图示:选择“开始菜单”选项卡,点击“自定义”按钮 在Win7系统“自定义开始菜单”设置面板中,我们可以对Win7开始菜单做详细的个性化设置。比如显示什么,不显示什么,显示的方式和数目等等。如果想恢复初始设置,点击“使用默认设置”按钮可以轻松一键还原所有原始设置。 为了满足小丽想要在Win7开始菜单中显示最近使用项目的愿望,我们只需在这里勾选“最近使用的项目”,然后点击这里和上一级设置面板的中“确定”按钮,这个设置就生效了。

FireBug调试

J a v a s c r i p t的调试利器:F i r e b u g使用详 解 收藏 J a v a s c r i p t的调试,是开发W e b应用尤其是A J A X应用很重要的一环,目前对 J a v a s c r i p t进行调试的工具很多,我比较喜欢使用的是F i r e b u g。F i r e b u g是J o e H e w i t t开发的一套与F i r e f o x集成在一起的功能强大的w e b开发工具,可以实时编辑、调试和监测任何页面的C S S、H T M L和J a v a S c r i p t。 本文主要是为初学者介绍一下F i r e b u g的基本功能与如何使用F i r e b u g。由于本人水平与能力有限,在文章中的可能会有很多错误与遗漏,希望大家能谅解和指正! 1、安装 F i r e b u g是与F i r e f o x集成的,所以我们首先要安装的事F i r e f o x浏览器。安装好浏览器后,打开浏览器,选择菜单栏上的“工具”菜单,选择“附加软件”,在弹出窗口中点击右下角的“获取扩展”链接。在打开的页面的s e a r c h输入框中输入“f i r e b u g”。等搜索结果出来后点击F i r b u g链接(图1-1红色圈住部分)进入F i r e b u g的下载安装页面。 图1-1 在页面中点击I n s t a l l N o w(图1-2)按钮。 图1-2 在弹出窗口(图1-3)中等待3秒后单击“立即安装”按钮。

等待安装完成后会单击窗口(图1-4)中的“重启 F i r e f o x”按钮重新启动F i r e f o x。 图1-4

如何使用firebug进行调试

如何使用firebug进行调试 2009-06-05 18:34 不了解的同学先“点这里”看看什么是Firebug。简单来说,Firebug是Firefox上用来监视、编辑和调试站点的CSS、HTML、DOM和JavaScript的扩展工具。 我们先到Firebug的主页上下载最新的版本装上,下面开始调试: 1、查看、编辑HTML元素及其CSS 安装好Firebug之后,你可以通过点击浏览器右下方的小虫子打开Firebug,如图: [打开Firebug] 或者直接按F12,如果要以窗口形式打开的话,就按下CTRL+F12 打开Firebug之后,点击“查看”,然后选择页面上任何需要编辑的地方,Firebug会将其选中,并且在HTML结构中将其高亮,如图: [Firebug的查看按钮] 之后你可以对该元素的HTML结构、属性进行任意的编辑,修改后的效果都会实时的展现在页面当中。 同时在Firebug的右侧是该元素对应的CSS样式,如下图: [Firebug中元素的样式查看] 图中的样式,显示了该元素被重新定义的样式继承关系,比如“继承自body.CurHome”的“text-align”属性被“继承自div.shell”的“text-align”覆盖,原先的属性就会以中横线的形式表示出来。如果要查看所有的属性,请勾选图中标“1”的选项。 单击“2”可以禁用/打开某条CSS属性;单击任意一个属性或者属性值可以进行CSS的编辑,如“3”;双击“4”则可以新建一条CSS属性。现在我们点击下“5”来看看CSS布局面板: [Firebug中的CSS布局面板] 上面这幅图展现的是一个HTML结构的标准盒模型,通过点击相应的数值可以修改该值,同时在浏览器窗口中显示出对应的效果来。 2、查看动态生成的HTML代码的方法 通过“查看源代码”的方法,无法看到由JS动态生成的HTML结构,这里我们可以通过Firebug 来查看,如下图,选中“body”节点,按下“编辑”,即可输出页面上源文件的代码以及动态生成的代码。 [查看所有动态生成源代码]

网站文章发布指南

网站文章发布指南 (一)标题 1.尽可能更换标题内容; 2.系列文章可以更换系列主题(如:高尔夫球杆迷思->球具解惑); 3.长短适中,最好刚好在首页上显示完整; 4.注意在标题中增加关键词; (二)文字 1.先复制到记事本中去除所有格式,然后使用word中(也可直接选择性复制到word 中); 2.在word中进行繁简转换,并使用全角符号替换半角符号(替换.为。时候应注意); 3.然后再复制到记事本中再次去除word格式,最后复制到编辑器中; 4.在编辑器里使用回车进行分段,每段前空两个全角空格; 5.小标题之前也空两格,并加粗(不包含空格,但包含之后的冒号); 6.去掉段落前的“-”符号及其他无用符号; 7.文字使用默认对齐,不是点击编辑框的左对齐,若是操作错误(如点成居中),可 以到源代码中删除对应样式代码; (三)配图 1.所有文章必须配图,至少一张,长文章可以使用多张配图; 2.如原文中有无水印图可以直接使用; 3.原文中没有可以使用的图片,使用百度或者谷歌图片搜索相关关键词,尽量找前几 页的图片; 4.图片长宽建议值为500px(使用画图缩放后保存),如果特殊图片样式可酌情处理; 5.图片必须下载到本地,然后通过编辑器上传到空间中; 6.在保证图片大小及显示效果的同时,尽量使用JPEG格式的图片(扩展名.jpg); 7.图片名称尽量长一些,特殊一些,避免与原有上传的图片冲突,无好想法的时候可 以使用日期+主题命名(如:20110915_callaway.jpg); 8.图片嵌入位置一般为最开始或者第一段至第三段中间,多张图片可按照章节配图 (一般在小标题前); 9.文章配图均为单独一段,居中对齐; 10.图片上传后必须填写图片说明(Alt值),图片说明内容一般为正常图片说明文字或 者文章标题,也可以用关键词(如人名、比赛名、球杆名); 11.部分图片可以在图片下居中放置减短文字说明; 12.图片上传错误的情况,务必到FTP上删除上传错误的图片; 13.如有印象的图片重复使用,务必使用原来上传的图片,不要重复上传; (四)表格 1.可以直接复制来源中表格的HTML源代码; 2.注意去除无用的空格、无用换行、外链样式(class=”XXX”),保留直接写入的style 样式; 3.检查表格宽度,不能超过690px; 4.表格代码直接插入编辑器HTML代码编辑中,前后不加 ; (五)引用

清除最近使用过的文档记录讲解

1.清除最近使用过的文档记录 以Windows XP为例,右键点击“开始”按钮,选择“属性”,在弹出的设置任务栏和开始菜单属性对话窗中点“自定义”按钮,在“自定义开始菜单”对话框中的“高级”标签下点“清除列表”。若要让系统永不自作多情记住使用文档的记录,请去掉“列出我最近打开的文档”前的钩。 小提示:XP会把最近访问文档的快捷方式放在C:\Documents and Settings\用户名\Recent中,手工删除它们也能让文档菜单“失去记忆”。 2.删除临时文件夹中的内容 当执行过安装软件、打开文档等操作时,在临时文件夹中会留下相应文件,可以手工清除在下列位置中的内容:C:\Windows\Temp、C:\Documents And Settings\用户名\Local Settings\Temp。如在删除时提示有文件在使用,就需要关掉相关程序,最好重启一次再删除。 3.清除“运行”、“查找”等处的历史记录 清除“运行”对话框中记录的输入内容,可修改注册表。这些记录被保存在“HKEY_CURRENT_USER \Software\Microsoft\Windows\CurrentVersion\Explorer\ RunMRU”分支下,将其完全删除后重启。此外,该主键下的“DocFindSpecMRU”项,在右侧栏目中显示的是“查找”的历史记录,可一并删除。 4.隐藏在IE中的行踪 上网后,会有大量信息反映你的所作所为,这还了得? ①清空Internet临时文件夹 别人查看“Internet临时文件夹”下的图片、Flash等文件便能大体知道你曾到过的网站。要清除它们,可依次单击IE菜单栏中的“工具”→“Internet选项”,打开“Internet选项”对话框,在“常规”标签中点击“删除文件”按钮,在弹出的“删除文件”窗口中勾选“删除所有脱机内容”,最后点击“确定”。 ②我不要“小甜饼”(Cookie) Cookie也可能是泄密的一个“罪魁祸首”,在“Internet选项”对话框的“常规”标签中单击“删除Cookies”按钮,待弹出窗口后单击“确定”按钮,可删除它们。

Fiddler的基本介绍及使用(个人整理)

Fiddler工具的介绍及使用 一、Fiddler的基本介绍 Fiddler官方网站提供了大量的帮助文档和视频教程,这是学习Fiddler的最好资料。 Fiddler是最强大最好用的Web调试工具之一,它能记录所有客户端和服务器的http和https请求,允许你监视,设置断点,甚至修改输入输出数据。 Fiddler无论对开发人员或者测试人员来说,都是非常有用的工具。 Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯,设置断点,查看所有的“进出”Fiddler的数据(指cookie,html,js,css等文件,这些都可以让你胡乱修改的意思)。Fiddler 要比其他的网络调试器要更加简单,因为它不仅仅暴露http通讯还提供了一个用户友好的格式。 二、Fiddler的工作原理 Fiddler 是以代理web服务器的形式工作的,它使用代理地址:127.0.0.1,端口:8888。当Fiddler 退出的时候它会自动注销,这样就不会影响别的程序。不过如果Fiddler非正常退出,这时候因为Fiddler 没有自动注销,会造成网页无法访问。解决的办法是重新启动下Fiddler。 三、同类的其它工具 同类的工具有: httpwatch, firebug, wireshark

四、Fiddler 开启原理 左下角的capturing显示,表示开,不显示表示关,也可以用F12进行开关,或者File菜单下Capture Traffic 被勾选,勾选后fiddler才能监控浏览器的一举一动。 代理开关为开:可以抓到包,代理开关为关:抓不到包 浏览器的代理设置默认是关着的,工具--Internet选项--连接--局域网设置--代理服务器 Fiddler在操作时,通过修改注册表的方式,将系统的一些VRnet的代理模式全部给修改掉,改到Tools--Telerik Fiddler Options--Connections自己的代理端口上,默认端口为8888。 如果修改端口,需重启软件件才会生效,就是每次重新开启软件,它会根据你填写的端口打开一个自己的的代理,此时在通过代理开关,比如IE或者系统软件。只要你走系统代理,都可以抓到数据包。 五、版本说明 Fiddler一共2个版本,一个是Fiddler2,一个是Fiddler4,两个版本没有太大的区别,系统底层支持是不一样的,Framework版本不同(.net版本) Fiddler4支持win8以上 Fiddler2支持winXP(.netk只有2.X版本)、win7(.netk只有3.X版本) 如果win7要安装Fiddler4,会提示安装.net 4.0以上版本 底层并没有太大的区别,最终会影响在做Fiddler插件,因为Framework版本最终决定Fiddler插件版本 建议使用Fiddler4版本,只要升级Framework框架版本到4.0即可。 六、Fiddler界面详解

清除电脑中“我最近文档”的记录

清除电脑中“我最近文档”的记录 1.清除最近使用过的文档记录 以Windows XP为例,右键点击“开始”按钮,选择“属性”,在弹出的设置任务栏和开始菜单属 性对话窗中点“自定义”按钮,在“自定义开始菜单”对话框中的“高级”标签下点“清除列表”。若 要让系统永不自作多情记住使用文档的记录,请去掉“列出我最近打开的文档”前的钩。 小提示:XP会把最近访问文档的快捷方式放在C:\Documents and Settings\用户名\Recent中, 手工删除它们也能让文档菜单“失去记忆”。 2.删除临时文件夹中的内容 当执行过安装软件、打开文档等操作时,在临时文件夹中会留下相应文件,可以手工清除在下列位置中的内容:C:\Windows\Temp、C:\Documents And Settings\用户名\Local Settings\Temp。 如在删除时提示有文件在使用,就需要关掉相关程序,最好重启一次再删除。 3.清除“运行”、“查找”等处的历史记录 清除“运行”对话框中记录的输入内容,可修改注册表。这些记录被保存在 “HKEY_CURRENT_USER \Software\Microsoft\Windows\CurrentVersion\Explorer\ RunMRU”分支下,将其完全删除后重启。此外,该主键下的“DocFindSpecMRU”项,在右侧栏 目中显示的是“查找”的历史记录,可一并删除。 4.隐藏在IE中的行踪 上网后,会有大量信息反映你的所作所为,这还了得? ①清空Internet临时文件夹 别人查看“Internet临时文件夹”下的图片、Flash等文件便能大体知道你曾到过的网站。要清除 它们,可依次单击IE菜单栏中的“工具”→“Internet选项”,打开“Internet选项”对话框,在“常规”标签中点击“删除文件”按钮,在弹出的“删除文件”窗口中勾选“删除所有脱机内容”,最后点击“确定”。 ②我不要“小甜饼”(Cookie) Cookie也可能是泄密的一个“罪魁祸首”,在“Internet选项”对话框的“常规”标签中单击“删除Cookies”按钮,待弹出窗口后单击“确定”按钮,可删除它们。 小提示:一种保险的办法是在上网后,进入Internet临时文件夹(该文件夹可在Internet选项对话框的“常规”选项下点“设置”来查看具体位置),删除其下所有内容,这样,临时文件及 Cookie等都会被清除。 ③消除访问网页的历史记录 IE会将最近三周的访问历史记下,要“踏网无痕”可得清除它们,只要删除“C:\Documents and Settings\用户名\Local Settings\History”文件夹中的所有内容即可。也可在Internet选项对话框的“常规”标签下点“清除历史纪录”按钮。 要让IE不记录访问历史,请在Internet选项对话框的“常规”选项下,将网页保存在历史纪录中 的天数从默认的20改成0即可。 ④清除IE记住的表单内容 当访问网站时,一些网页会提示输入,例如,搜索时会要求输入搜索内容、登录邮箱则要填用户名、密码——这些东西会被IE自动记录。要删除它们,可在“Internet选项”对话框的“内容” 标签下点“自动完成”按钮,在弹出的“自动完成设置”对话框中将“表单”、“表单上的用户名和密码”和“提示我保存密码”前的钩去掉,再单击“清除表单”、“清除密码”按钮,当询问时点“确定”。

如何清除电脑中我最近文档记录

如何清除电脑中我最近文档记录 1. 清除最近使用过的文档记录 以Windows XP为例,右键点击开始”按钮,选择属性”在弹出的设置任务栏和开始菜单属性对话窗中点“自定义”按钮,在“自定义开始菜单”对话框中的“高级”标签下点“清除列表”。 若要让系统永不自作多情记住使用文档的记录,请去掉“列出我最近打开的文档”前的钩。 小提示: XP会把最近访问文档的快捷方式放在C: 用户名\Recent中,手工删除它们也能让文档菜单“失去记忆”。 2. 删除临时文件夹中的内容 当执行过安装软件、打开文档等操作时,在临时文件夹中会留下相应文件,可以手工清除在下列位置中的内容: C: \Windows\Temp 、C: 用户名\LocalSettings'Temp。如在删除时提示有文件在使用,就需要关掉相关程序,最好重启一次再删除。 3. 清除“运行”、“查找”等处的历史记录 清除“运行”对话框中记录的输入内容,可修改注册表。这些记录被保存在 “ HKEY_CURRENT_USER \Software\Microsoft\Windows\CurrentVersion\Explorer\ RunMRU分支下,将其完全删除后重启。此外,该主键下的 “ DocFi ndSpecMRU,在右侧栏目中显示的是查找”的历史记录,可一并删除。

4?隐藏在IE中的行踪 上网后,会有大量信息反映你的所作所为,这还了得? ②我不要“小甜饼”(Cookie) 小提示: ③消除访问网页的历史记录 IE会将最近三周的访问历史记下,要踏网无痕”可得清除它们,只要删除 C: ④清除IE记住的表单内容 ⑤删除地址栏列表中的网址 在IE地址栏中输入要访问站点的部分字母时会自动打开列表,其中有最近曾访问的相匹配的站点,这也得清除。 小提示: 当完成上述操作后,千万别忘清空回收站。若此处没有收拾干净,就将前功尽弃了。 二、清除你在应用程序中的“行踪” 一些软件会记录曾打开的文件等信息。因此在将系统中的痕迹打扫后,别忘了清除在应

火狐调试工具-DevTools的介绍与使用

火狐调试工具-DevTools的介绍与使用 咱们做写js代码的时候,遇到的一个最大的问题就是调试问题,很多开发者在写js代码的时候,经常都非常痛苦。但是我们如果掌握好相应的调试工具,那么就可以比较游刃有余的解决js的调试问题。工欲善其事,必先利其器。 调试工具比较好的有火狐的firebug,另外chrome的自带调试工具也非常不错(英文版)。 掌握好这些调试工具,可以更好的学习js,也可以大大提高咱们完成js的排错能力。因此,我建议所有要使用js的人员都最好能好好的掌握一下这些工具。 本来火狐的firebug一直以来都是我认为最好的调试工具,但是现在Firebug官方已经宣布了停止Firebug的维护,咱们新版本的火狐已经无法再使用它。 以下是在官网找到的Firebug最新版本(最多只支持火狐47): 虽然非常可惜,但是好在火狐还有自带的调试工具,而Firebug团队也推荐大家可以使用火狐的DevTools工具。 下面就是我总结的这款工具的一些基本的使用方式。 1、安装并打开调试工具 下载火狐浏览器(我下载的firefox54)安装即可 地址:https://www.360docs.net/doc/244509703.html,/ 咱们打开火狐浏览器,直接按F12即可打开这个调试工具。 PS:有些用户火狐安装插件,可能导致F12没有效果,可以在设置中打开(如下图): 找到开发者选项:

点击Web控制台打开

这时候可以看到调试工具已经打开:

2、调试工具的页面总体介绍 1)查看器:可以在下方看到页面的HTML代码,而选中某个HTML元素也可以看到它对应的CSS样式(结合审查元素工具使用非常好) 2)控制台:咱们用得最多的一个面板,可以自定义决定咱们要看哪些高度数据(console 打印的数据都在这里展示) 3)调试器:可以为js添加debug功能 4)样式编辑器: 查看当前页面的所有样式 5)性能:分析js的每一个操作的性能 6)内存:当前页面的一些堆栈内存 7)网络:查看当前每一次请求 对咱们比较重要的工具有:审查工具,控制台,网络 现在,咱们就单独介绍一下这三个工具的使用: 工具一:审查工具 点击这个审查工具,我们就可以查看页面上的所有元素(使用方式如下图):

Yslow和page speed使用指南

Yslow和page speed的使用说明 一、Yslow和page speed简介 Yslow可读为why slow(为什么慢),是Yahoo发布的一款基于FireFox的插件,由此可知其作用主要是检查网页运行缓慢的原因。 Page Speed 是开源 Firefox/Firebug 插件。网站管理员和网络开发人员可以使用 Page Speed 来评估他们网页的性能,并获得有关如何改进性能的建议。 二、安装Yslow和page speed 安装YSlow必须首先先安装Firebug,然后下载YSlow,再对其安装。 1、下载Firebug到本地,(https://www.360docs.net/doc/244509703.html,/download/51156.html) 2、解压Firebug,得到如下图的xpi文件; 3、打开Firefox浏览器,点击左上角的菜单项,选择【附加组件】进入附加组件管理器;如下图 4、在附加组件管理器里面找到【从文件安装附加组件】选项;

5、在本地找到刚才解压的xpi文件,将其他加载并安装;完成firebug的安装。 6、安装Yslow、page speed和安装firebug的步骤一样。 三、启动Yslow和page speed 这两个插件的启动方式都一样,有两种启动方式,由firebug界面统一管理。 1、打开firefox浏览器,在浏览器的右上角有个爬虫图标,点击该图标即可进入(退出)插件管理界面; 2、打开firefox浏览器,在浏览器的右下角有个Yslow图标,点击即可进入(退出)插件管理界面;

Yslow和page speed的使用指南 一、Yslow的分析 启动firebug后,显示如下界面,其中Yslow和page speed两个插件都在里面: 先输入相应的URL地址后,再点击 Run Test 运行Yslow,也可以点击 Grade, Components, 或Statistics选项开始对页面的分析。 二、Yslow视图 YSlow显示测试结果的分析,分为等级、组件、统计信息。你可以浏览这些观点之间选择标签以观的名字在YSlow标签的Firebug控制台。以下是说明的等级、组件、统计信息。 (一)、等级视图 查看一个分析,选择页面的性能等级标签或点击网页的字母等级在状态栏这页纸的底部。视图显示了等级为网页的成绩单。整个字母等级为页面显示在顶部随着全面数值的表现。这个页面是基于22可分级的高性能网页的规则(见性能规则)。这些规则是列在按重要性的顺序,从最重要不重要。从 A 级到 F 级,A 级为最高。下面是一个等级的例子:

Selenium使用说明

Selenium安装及使用说明 这是我在使用Selenium中的一些经验,供大家参考。 一、版本说明 目前,Selenium有四个版本,Selenium IDE、Selenium Core、Selenium RC、Selenium Core HTA。Selenium Core需要在远程服务器上安装,不支持跨域,且仅支持selenese语言。Selenium Core HTA仅支持IE浏览器,selennese语言。Selenium IDE和Selenium RC(Remote Control)都支持跨域,不需要在远程安装,它们各自有一些无可比拟的优点,简单介绍如下: Selenium IDE 优点: 它能够嵌入到浏览器中(但它是一个完整的测试工具);可以直接操作页面进行录制/回放,比较直观;可以保存成不同语言的版本,如java、python、PHP、C#、perl等。缺点: 目前只支持Firefox(最新版本可以支持Firefox3了)。另外,它仅支持selenese语言。 Selenium RC 优点: 支持目前几乎所有的浏览器,包括firefox、IE、Opera等;支持多种语言,IDE中生成的所有语言他都支持,可以使用这些语言进行编程;同时,RC支持两种框架JUnit和TestNG,借助JUnit可以生成多种不同形式的结果文档,TestNG目前也备受推崇,因为他支持多线程,对Selenium Grid支持比较好,如果有需要以后可以研究一下,这里我们用JUnit。 缺点: 对firefox3支持不太好,需要进行相关配置,目前使用firefox2; 鉴于我们的实际情况,Selenium IDE直观的页面录制及SeleniumRC支持Java语言等优点,所以采用了Selenium IDE + Selenium RC + Java + JUnit + Ant这样一个框架进行测试。使用Ant+JUnit是为了测试自动化及更好的输出测试报告。 二、安装 以下是我在window下使用selenium进行测试需要安装的软件(注:使用的版本是我测试成功的版本): ●FireFox2 ●JDK6: ●Selenium IDE 1.0 beta2: ●Selenium RC1.0 ●Ant1.7.1 ●JUnit4.5 ●Firebug(可选) 1.FireFox2:

30个HTML代码编写技巧

30个HTML代码编写技巧.txt不相信永远,不拥有期待,不需要诺言当你不能再拥有的时候,唯一可以做的,就是令自己不要忘记。王子之所以能口奂酉星目垂美人是因为王子用心了我能口奂酉星什么本文总结了30条HTML代码编写指南,只要在编写HTML代码的过程中牢记它们,灵活运用,你一定会写出一手漂亮的代码,早日迈入专业开发者的行列。1. 一定要闭合HTML标签 在以往的页面源代码里,经常看到这样的语句:

  • Some text here.
  • Some new text here.
  • You get the idea. 也许过去我们可以容忍这样的非闭合HTML标签,但在今天的标准来看,这是非常不可取的,是必须百分百避免的。一定要注意闭合你的HTML标签,否则将无法通过验证,并且容易出现一些难以预见的问题。 最好使用这样的形式:
    • Some text here.
    • Some new text here.
    • You get the idea.
    2. 声明正确的文档类型( DocType ) 笔者早先曾加入过许多CSS论坛,在那里,如果有用户遇到问题,我们会建议他首先做两件事: 1. 验证CSS文件,解决所有可见的错误 2. 加上文档类型 Doctype DOCTYPE 定义在HTML标签出现之前,它告诉浏览器这个页面包含的是HTML,XHTML,还是两者混合出现,这样浏览器才能正确的解析标记。 通常有四种文档类型可供选择:1. 2. 3. 4. 关于该使用什么样的文档类型声明,一直有不同的说法。通常认为使用最严格的声明是最佳选择,但研究表明,大部分浏览器会使用普通的方式解析这种声明,所以很多人选择使用HTML4.01标准。选择声明的底线是,它是不是真的适合你,所以你要综合考虑来选择适合你得项目的声明。3. 不要使用嵌入式CSS样式 当你在埋头写代码时,可能会经常顺手或偷懒的加上一点嵌入式css代码,就象这样:

    网页教学网 这样看起来即方便又没有问题,但是它会在你得代码中产生问题。 在你开始写代码时,最好是在内容结构完成之后再开始加入样式代码。 这样的编码方式就像打游击,是一种很山寨的做法。——Chris Coyier 更好的做法是,把这个P的样式定义在样式表文件里:someElement > p {color: red;}4. 在页面head标签中引入所有的样式表文件 理论上讲,你可以在任何位置引入CSS样式表,但HTML规范建议在网页的head标记中引入,这样可以加快页面的渲染速度。 在雅虎的开发过程中,我们发现,在head标签中引入样式表,会加快网页加载速度,

    selenium_2.0安装使用说明2

    Selenium2.0使用说明

    目录 第1章Webdirver基础 (1) 1.1 介绍WebDriver (1) 1.2 安装selenium webdriver (1) 1.2.1安装jdk并配置环境变量 (1) 1.2.2安装Firefox,Selenium IDE,Firebug和xpath checker (1) 1.2.3安装eclipse (2) 1.2.4安装selenium webdriver (6) 1.3 工具使用 (6) 1.3.1 Selenium-IDE使用 (6) 1.3.2 Firebug的使用 (7) 1.3.3 xpath checker的使用 (8) 1.3.4 Selenium 2.0的使用 (9) 第2章Webdirver对浏览器的支持 (10) 2.1 HtmlUnit Driver (10) 2.2 FireFox Driver (10) 2.3 InternetExplorer Driver (10) 第3章对浏览器的简单操作 (11) 3.1 用webdriver打开一个浏览器 (11) 3.2 打开测试页面 (11) 3.3 关闭浏览器 (12) 3.4 返回当前页面的url 和title (12) 第4章使用操作 (12) 4.1 如何找到页面元素 (12) 4.1.1 By ID (12) 4.1.2 By Name (13) 4.1.3 By XPATH (13) 4.1.4 By Class Name (13) 4.1.5 By Link Text (13) 4.2 如何对页面元素进行操作 (14) 4.2.1 输入框(text field or textarea) (14) 4.2.2 下拉选择框(Select) (14) 4.2.3 单选项(Radio Button) (14) 4.2.4 多选项(checkbox) (15) 4.2.5 按钮(button) (15) 4.2.6 左右选择框 (15) 4.2.7 弹出对话框(Popup dialogs) (15) 4.2.8 表单(Form) (16) 4.2.9 上传文件(Upload File) (16) 4.2.10 Windows 和Frames之间的切换 (16) 4.2.11 拖拉(Drag andDrop) (16) 4.2.12 导航(Navigationand History) (16)

    js各浏览器调试工具使用说明

    首先,在各个浏览器中,断点调试支持的最好的当然是Firefox,Firefox不仅可以使用Firebug调试页面js脚本,还可以用高级调试工具例如JavaScript Debugger (Venkman) 来调试Firefox扩展里的js。除此之外,Firefox还支持一些更为高级的断点调试、变量监视功能。 其他浏览器里,Opera、Chrome和Safari的调试功能也比较好用。Opera的DragonFly速度相对比较快,界面清爽,功能强大,但不如Safari等友好。相比来说,IE8的程序员工具简直没法用。 这次时间有限,先来总结一下Firefox下的调试技巧。 1. 使用Firebug进行断点调试 使用Firebug调试JavaScript非常方便。具体步骤: a. 打开Firebug后,启用“脚本”调试,找到引用的脚本文件(或者行内js); 用Firebug找到要调试的脚本(点击放大) b. 在适当的位置加入断点; c. 如果断点已经执行过,则刷新页面,这时脚本就会在断点处中断。如果断点没有执行过,那可以直接执行页面上的动作(例如点击按钮等),然后代码会在断点处中断; 用Firebug进行断点调试(点击放大) d. 观察函数调用栈,观察local变量,也可以进行单步执行,进行调试。 确实非常简单!用Firebug断点调试的优点总结如下: ?能加断点的行用绿色行号,非常直观; ?call stack用两种方式显示出来,很方便; ?本地变量的显示非常清晰明了。 2. 使用JavaScript Debugger进行断点调试

    这是老牌的调试工具,之前叫做Venkman,可以以扩展形式安装在Firefox上,我们在这里就称他为Venkman吧。它不仅能够调试页面脚本,还能调试Firefox 扩展(extension)里的js。我们在做Firefox扩展开发时,Venkman是必不可少的工具,老田强力推荐!当然,Firefox本身的逻辑实现,也是用JavaScript 来做到的。我们现在可以用Venkman来调试一下Firefox本身。Firefox的核心js是browser.js,在这个路径下: chrome://browser/content/browser.js 我们打开Venkman之后,在Loaded Scripts里填入browser.js,这个js文件就会被过滤出来(如果没有看到browser.js,那么你可能需要查一下是否选上了Debug->Exclude browser files)。 Venkman:选择要调试的js文件(点击放大) 我们找到让浏览器后退的代码,然后点击Firefox的后退按钮,这时Venkman 就会停在BrowserBack方法上!让我们再一步一步地看一看,Firefox自己到底做了什么。btw,实现Firefox的js代码也不是很漂亮嘛~~~ 用JavaScript Debugger断点调试Firefox(点击放大)

    火狐浏览器中firebug调试console命令大全

    Console命令详解,让调试js代码变得更简单Firebug是网页开发的利器,能够极大地提升工作效率。 但是,它不太容易上手。我曾经翻译过一篇《Firebug入门指南》,介绍了一些基本用法。今天,继续介绍它的高级用法。 =================================== Firebug控制台详解 作者:阮一峰 出处:https://www.360docs.net/doc/244509703.html,/blog/2011/03/firebug_console_tutorial.html 控制台(Console)是Firebug的第一个面板,也是最重要的面板,主要作用是显示网页加载过程中产生各类信息。 一、显示信息的命令 Firebug内置一个console对象,提供5种方法,用来显示信息。 最简单的方法是console.log(),可以用来取代alert()或document.write()。比如,在网页脚本中使用console.log("Hello World"),加载时控制台就会自动显示如下内容。 另外,根据信息的不同性质,console对象还有4种显示信息的方法,分别是一般信息https://www.360docs.net/doc/244509703.html,()、除错信息console.debug()、警告提示console.warn()、错误提示console.error()。 比如,在网页脚本中插入下面四行: https://www.360docs.net/doc/244509703.html,("这是info");

    console.debug("这是debug"); console.warn("这是warn"); console.error("这是error"); 加载时,控制台会显示如下内容。 可以看到,不同性质的信息前面有不同的图标,并且每条信息后面都有超级链接,点击后跳转到网页源码的相应行。 二、占位符 console对象的上面5种方法,都可以使用printf风格的占位符。不过,占位符的种类比较少,只支持字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o)四种。 比如, console.log("%d年%d月%d日",2011,3,26); console.log("圆周率是%f",3.1415926); %o占位符,可以用来查看一个对象内部情况。比如,有这样一个对象: var dog = {} ; https://www.360docs.net/doc/244509703.html, = "大毛" ;

  • 相关文档
    最新文档