IE8“开发人员工具”(下)
浏览器模式
说白了,就是让用户选择当前页面用何种IE版本去渲染。
文本模式
说起“文本模式”这个名词,这又要回到渲染页面的3种模式了:诡异模式(Quirks mode,也有翻译为兼容模式、怪异模式的),标准模式(Standards mode),和几乎标准模式(Almost standards mode)。这是一个非常重要、但是很多人却比较模糊的概念。一两句话不太能说清楚,这样说吧——“页面的不同渲染模式,将直接影响页面的最终呈现效果”,也就是说,一个页面如果在这种模式下显示完美,但是在另外一种模式下可能就显示的一塌糊涂。而决定页面模式的是页面的!DOCTYPE属性。
乖乖,这玩意太绕人了,还是直接上例子吧。最经典的就是对盒装模型的解释差异了。下面两个图,是相同页面,采用不同页面渲染模式的最终显示效果。
利用IE8开发人员工具调试JavaScript脚本
重头戏来了。很多朋友梦寐以求的功能呀——JavaScript脚本调试。一直摆脱不掉FireFox,就是因为Firebug实在太好用。虽然利用VS这样航母级的软件也能进行JavaScript脚本的调试。但是,很多前台开发人员并不会为了一个JavaScript调试功能而去安装那种大家伙。所以对JavaScript的调试,IE的用户一直耿耿于怀。但是,现在终于可以平息了。因为IE8开发人员工具终于也有了小巧,却功能强大的JavaScript调试功能。
图上的说明已经很清楚了,下面就详细讲一下“控制台”、“断点”、“局部变量”、“监视”、“调用堆栈”这些视图吧。
控制台
在控制台会显示脚本调试中的一些信息,例如错误信息、警告信息一类的。
恩,其实也可以当成是一个微型JavaScript运行环境。你可以在这里直接键入脚本并运行。如果一行不够的话,可以切换到多行模式。输入完毕后,点击“运行脚本”,就可以看到运行结果了。
断点
是一个显示你设定的所有断点的列表。方便你统一管理:统一删除、统一使用或者统一禁用。
局部变量
可以详细的显示各个变量的所有方法、事件和属性。我最喜欢干的事情,就是一个个的看下去,看到不知道的就去查资料,绝对是个学习JavaScript的好方法。
监视
可以显示任意你需要的变量的方法、事件和属性。可以添加多个。整体来说和局部变量视图差不多,只是可以更灵活的显示你需要的而已。
调用堆栈
可以直观地显示函数调用堆栈情况,以及现在执行到哪个函数的情况。对于理顺脚本的运行顺序和嵌套很有帮助。
IE8开发人员工具的探查器
用过微软SQL数据库中的Profiler的朋友都知道,那个一个帮助SQL分析效率的工具。它会记录所有的执行以及他们的执行时间,从而提供一份报表。这样,就可以知道到底是什么在效率上拖l了后腿。
IE8 的探查器(Profiler),也引入了这个概念,只是它探测的是JavaScript脚本而已。
先点击【开始配置文件】按钮,然后运行脚本或者刷新页面。等脚本执行完了,或者页面刷新完毕后点击【停止配置文件】按钮,就会生成探查报告了。
它提供两种视图,一种是“函数”,另一种是“调用树”。无论何种视图,都可以清晰且忠实的展现出各个函数的执行所用时间。从而,方便你分析出“为啥我的页面那么慢呢?”
函数视图
函数视图可以方便的按照各个参数进行排序,从而方便的找出类似“谁用的时间最长”这样的答案。
调用树
调用树视图可以方便的看出各个函数之间的调用关系。
IE8“开发人员工具”(下)的更多相关文章
- IE8"开发人员工具"使用详解下(浏览器模式、文本模式、JavaScript调试、探查器)
来源: http://www.cnblogs.com/JustinYoung/archive/2009/04/03/kaifarenyuangongju2.html 在上一篇文章IE8“开发人员工具” ...
- IE8“开发人员工具”使用详解上(各级菜单详解)
来源: http://www.cnblogs.com/JustinYoung/archive/2009/03/24/kaifarenyuangongju.html IE8“开发人员工具”使用详解上(各 ...
- IE8“开发人员工具”(上)
认识“开发人员工具” 开发人员工具在IE8的工具菜单下,或者直接点击F12快捷键也可以呼叫出来. 提供一系列的小工具,让你可以方便的查找页面的bug,包括html代码.css代码和JavaScript ...
- IE8 "开发人员工具" 无法使用,无法显示
经常使用IE8开发工具的开发人员可能会遇到这么一种去情况:按F12时任务栏里出现开发人员工具的任务,但是开发人员工具窗体不弹出,也不出现在IE8里,重装IE88后还是存在此问题. 解决办法其实非常简单 ...
- ie8开发人员工具无法使用,按f12任务栏里出现任务,但是窗体不弹出
楼主解决了么,刚出现你这样的问题,找了N久,终于解决了,他娘的,偏方啊任务栏不是出现那个箭头么,点击后没反应是吧在缩略图上点右键-最大化,然后就出来了,ctrl+p反正是可以出来调试模式 神人哪,IE ...
- IE开发人员工具教程
写在前面 一直非常谷歌的控制台,因为我是做前端的,谷歌浏览器在我看来是解析JS最快的浏览器,所谓的熟能生巧,用熟悉了谷歌浏览器之后就特别喜欢用谷歌的控制台调试脚本.改变样式.查看HTML.查看资源加载 ...
- IE8按F12开发人员工具不显示
一直不喜欢用IE,不过为了项目需要,不得不使用IE 而且此功能只支持IE8,(⊙﹏⊙)b) 当按F12调出开发人员工具的时候发现显示不出来了,在任务栏里有显示,将鼠标放在任务栏的开发人员工具上, 背景 ...
- 在WIN7里IE8的开发人员工具打不开的解决办法
IE8新增了开发人员工具,非常不错,比早期的DevToolbar好用多了.不过在我的Win7下使用的时候偶尔会出现一个莫名其妙的问题,就是整个开发人员工具窗口消失了,打不开了.当你使用win+Tab切 ...
- windows7系统下升级到IE11时无法使用F12开发人员工具的解决办法
windows7系统下升级到IE11时,发现F12开发人员工具无法使用,打开都是空白的 解决办法,就是下载IE11的补丁,下载地址为:https://www.microsoft.com/zh-CN/d ...
随机推荐
- [PHP] 07 - Json, XML and MySQL
前言 [Node.js] 09 - Connect with Database 菜鸟JSON教程[内容不多] PHPSimpleXML[大概了解下即可] SQL语句需要复习一遍:http://www. ...
- 搞懂MapReduce
MapReduce的主要思想就是将计算任务分发至多台计算机(slave),然后master综合计算机结果.所以就涉及到多台计算机通信和同步的问题,这个应该由hadoop完成,把环境配置好后就像单机操作 ...
- Python处理数据
由于找实习,要学习python处理数据,python连接mysql,python读写文件,python读写xlsx文件,这些只要引入了相关的包,就非常容易,处理过程非常清晰.模块如果封装的好,没怎么学 ...
- HTTP协议中GET和POST方法的区别
转载 通常的理解 w3schools关于这个问题的解答:HTTP 方法:GET 对比 POST 列出了一般的理解: 方法 GET POST 后退按钮/刷新 无害 数据会被重新提交(浏览器应该告知用户数 ...
- python爬虫+使用cookie登录豆瓣
2017-10-09 19:06:22 版权声明:本文为博主原创文章,未经博主允许不得转载. 前言: 先获得cookie,然后自动登录豆瓣和新浪微博 系统环境: 64位win10系统,同时装pytho ...
- 关于device tree中的interrupts选项
http://blog.csdn.net/jiang__jiang/article/details/52064715 随着Linux的发展,dts技术是大势所趋.里面的interrupts = < ...
- .NET Core开发日志——WCF Client
WCF作为.NET Framework3.0就被引入的用于构建面向服务的框架在众多项目中发挥着重大作用.时至今日,虽然已有更新的技术可以替代它,但对于那些既存项目或产品,使用新框架重构的代价未必能找到 ...
- css学习_文本有关的样式属性、sublime快捷生成标签
1.css中color定义文本的颜色 写法:(最常用的是16进制的) 2.行间距 line-height 3.水平对齐方式 text-align left right center 4.首 ...
- [No0000D8]rar合并到JPG.bat用图片隐藏文件
echo off cls echo 请拖入jpg图像文件后回车: set /p imagefile= echo 请拖入rar文件后回车: set /p rarfile= copy /b %imagef ...
- day3:数据类型 str
1,int 一个数字占用的bit数目 i = 2 print(i.bit_length()) i = 3 print(i.bit_length()) i = 5 print(i.bit_length( ...