Dojo第一节:学会使用firebug对js,Dojo进行调适
内容概要:
学会使用firebug的基本功能
1. 简介:Firebug是Firefox的一个插件,用来对js代码进行调适的工具。
(官方废话:Firebug是firefox下的一个插件,可以调试全部站点语言,如Html,Css等,但FireBug最吸引我的就是javascript调试功能,使用起来非常方便,并且在各种浏览器下都能使用(IE,Firefox,Opera, Safari)。除此之外,其它功能还非常强大,比方html,css,dom的查看与调试,站点总体分析等等。总之就是一整套完整而强大的 WEB开发工具。再有就是其为开源的软件。)
2.安装 Firebug
第一步,点击 Firefox 浏览器上的“工具”选项,然后点击“附加软件”,在弹出的小窗体中,点击右下角的“获取扩展”选项
第二步,在点击“获取扩展”选项后,打开的页面中搜索 Firebug,在搜索结果的页面中,下载 Firebug 。须要注意的是,Firebug 的版本号要与 Firefox 的版本号相兼容。假设要查看自己 Firefox 的版本号,可通过点击浏览器“帮助”选项下“关于 Mozilla Firefox ”选项。
第三步,安装好,重新启动浏览器就可以。
3.Firebug 调试功能
快捷键一:当你输入document.get之后,按下tab键就能补齐为document.getElementById,很方便。假设你觉得补齐得不够理想,按下shift+tab又会恢复原状
快捷键二:直接在浏览器输入F12就可以直接打开firebug调适工具
进入正文:
功能一,Console 窗体的使用。 Console 窗体除了显示页面载入的文件以外,还能够直接显示页面中的代码错误和一些输出信息。
Console 窗体中输出调试信息。 Firebug 支持的调试语句较为经常使用的是 console.log 。
比方:
console.debug("I am debug");
console.info("I am info");
console.warn("I am warn");
console.error("I am error");
有 Javascript 经验的读者可能会习惯于使用 alert()
进行调试信息的输出,可是笔者觉得将调试信息在 Console 窗体中输出是一个更优的选择。首先,假设页面有非常多alert()
, 则点击“ OK ”让弹出框消失也是一个非常烦人的事情。其次,假设调试信息的量非常大,则是用
alert()
的弹出窗体将无法良好的完整展示调试信息。接着,alert()
无法查看对象和数组的细节信息。最后,假设在一个循环中使用alert()
, 将非常easy造成页面“死掉”。
功能二,HTML 窗体的使用。在 HTML 窗体中能够查看到页面的源码。除了能够查看页面的源码外,还能够使用 Firebug 的编辑功能直接对页面进行编辑。
在处于 HTML 窗体的模式下,点击 Edit button,将切换查看模式到编辑模式。须要注意的是,在使用 Edit 模式前,最好先提前选中页面的 body 代码区块。
在 Edit 模式下,须要注意的是,在页面新加完代码后,须要点击一下页面的其他不论什么地方,则其效果才会在页面上载入。
功能三,HTML 模式下的 Style,Layout,DOM 三窗体
在 HTML 窗体模式下,与 HTML 窗体相相应,在其右边有 Style,Layout,DOM 三个用于查看页面相应部分相关属性的窗体。当选中页面中的某个部分时,Style 显示选中部分的 CSS 属性,Layout 显示 CSS 的盒式模型,DOM 显示其选中部分的全部 DOM 对象。结合使用 Inspect 功能能够方便选择页面中所须要关注的部分。
功能四,Script 窗体的使用。 Script 窗体支持对 Javascript 的断点调试。
功能五,DOM 窗体和 Net 窗体的使用。 DOM 窗体主要显示的是页面中的全部对象,及其所包括的属性和方法。 Net 窗体主要是显示当前页面中所载入的各个文件的大小和载入各个文件所花费的时间。
Dojo第一节:学会使用firebug对js,Dojo进行调适的更多相关文章
- JAVAscript学习笔记 js事件 第一节 (原创) 参考js使用表
<!DOCTYPE html> <html lang="en" onUnload="ud()"> <head> <me ...
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
- seajs第一节,seajs基本使用
什么是seajs,它是干什么使用的,可以去网上搜索一下, 官网:http://seajs.org/docs/ 基本使用seajs <!DOCTYPE html> <html> ...
- 辛星跟您玩转vim第一节之vim的下载与三种模式
首先值得一提的是,我的vim教程pdf版本号已经写完了,大家能够去下载,这里是csdn的下载地址:点此下载 ,假设左边的下载地址挂掉了,也能够自行在浏览器以下输入例如以下地址进行下载:http://d ...
- 第一节:.Net版基于WebSocket的聊天室样例
一. 说在前面的话 该篇文章为实时通讯系列的第一节,基于WebSocket编写了一个简易版聊天样例,主要作用是为引出后面SignalR系列的用法及其强大方便之处,通过这个样例与后续的SignalR对比 ...
- Ionic 入门与实战之第二章第一节:Ionic 环境搭建之开发环境配置
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第二章第一节,主要对 Ionic 的开发环境配置做了简要的介绍,本文介绍的开发环境为 Mac 系统,Windows 系统基本类似,少许 ...
- 第一节 JavaScript概述
第一节 JavaScript概述 JavaScript:其实就是对HTML+CSS静态页面进行样式修改,使其实现各种动态效果. 编写JS脚本基本步骤: 1. HTML+CSS静态布局: 2. 确定要修 ...
- ASP.NET MVC深入浅出(被替换) 第一节: 结合EF的本地缓存属性来介绍【EF增删改操作】的几种形式 第三节: EF调用普通SQL语句的两类封装(ExecuteSqlCommand和SqlQuery ) 第四节: EF调用存储过程的通用写法和DBFirst模式子类调用的特有写法 第六节: EF高级属性(二) 之延迟加载、立即加载、显示加载(含导航属性) 第十节: EF的三种追踪
ASP.NET MVC深入浅出(被替换) 一. 谈情怀-ASP.NET体系 从事.Net开发以来,最先接触的Web开发框架是Asp.Net WebForm,该框架高度封装,为了隐藏Http的无状态 ...
- webpack第一节(1)
跟着慕课网的老师做了下笔记 webpack是一个前端打包工具 它可以优化网页.例如 页面模块化加载.图片优化.css.js压缩等等. 模块化加载也就是懒加载,按需加载,以前的模式是所以得css写在一起 ...
随机推荐
- SN74HC573ANSR 锁存器
这是它的工作电压范围 这个是功能表,数电上曾经学过: 内部的框图,也是数电的知识:
- LoadRunner--HTML与URL录制方式区别
Recording录制选项 这里提供了两个大类的录制方式: 1. HTML-based script基于HTML的脚本 这种方式录制出来的脚本是基于HTML基础的,为每个用户操作生成单独的步骤,这种脚 ...
- poj1679 The Unique MST(判定次小生成树)
The Unique MST Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 23180 Accepted: 8235 D ...
- 基于bootstrap的主流框架有哪些
基于bootstrap的主流框架有哪些 一.总结 一句话总结:其实可以直接百度bootstrap后台模板,出来一大堆,想用哪个用哪个. 二.[前端框架系列]浅谈当前基于bootstrap框架的几种主流 ...
- Windows服务安装命令:
sc create YY.SmsPlatform.RemoteDataCenter binPath= "E:\YY.SmsPlatform\YY.SmsPlatform.RemoteData ...
- maven 解决Cannot change version of project facet Dynamic web module to 2.5
我们用Eclipse创建Maven结构的web项目的时候选择了Artifact Id为maven-artchetype-webapp,由于这个catalog比较老,用的servlet还是2.3的,而一 ...
- python的sorted() 函数
摘自:http://www.runoob.com/python/python-func-sorted.html sortedClassCount=sorted(classCount.items(),k ...
- 9.11 Binder系统_分层
1.Binder系统过程分析,情景分析 server提供服务 (1)addService(服务名称,xxx)执行后会导致binder驱动在server的内核空间为服务创建一个binder_node结构 ...
- 新手MFC学习之Socket练习
事实上MFC这东西吧,好像也不光是MFC,非常多东西,事实上我如今才感觉到,假设想高速做一个东西出来的话.是没有必要系统的学关于这个东西的所有知识的.比方我想做一个MFC相似QQ的软件,可是我又不想花 ...
- php实现字符串替换
php实现字符串替换 一.总结 二.php实现字符串替换 代码一: //字符串替换 function str_replace($substr , $newsubstr, $str) { $m = st ...