第章JavaScript开发基础PPT课件.ppt

第14章JavaScript开发基础 14 1JavaScript的应用环境14 2最常用的开发工具14 35个最常用的JavaScript调试工具14 4综合实战1 用JavaScript计算借贷支出14 5综合实战2 九九乘法表高手私房菜 精通HTML CSS14 100 网页设计与制作密码 14 1JavaScript的应用环境 14 1 1客户端JavaScript14 1 2其他环境中的JavaScript14 1 3客户端的JavaScript 网页中的可执行内容14 1 4客户端JavaScript的特性 精通HTML CSS14 100 网页设计与制作密码 14 1 1客户端JavaScript 提起客户端那么就一定有相应的服务器端 而JavaScript主要是应用在客户端 JavaScript服务器端最早实现动态网页的技术是CGI CommonGatewayInterface 通用网关接口 技术 它可根据用户的HTTP请求数据动态从Web服务器返回请求的页面 精通HTML CSS14 100 网页设计与制作密码 14 1 2其他环境中的JavaScript 除了Web应用的相关领域之外 JavaScript还能够在多种不同的环境中运行 在较早一些的时候 Microsoft已经在Windows系统中支持一种HTA应用 这可以看作是由JavaScript HTML编写的类似GUI的应用程序 在 netframework的新版本中 Microsoft更是直接支持了J 精通HTML CSS14 100 网页设计与制作密码 14 1 3客户端的JavaScript 网页中的可执行内容 目前绝大多数浏览器中都嵌入了某个版本的JavaScript解释器 当JavaScript被嵌入客户端浏览器后 就形成了客户端的JavaScript 大多数人提到JavaScript时 通常指的是客户端的JavaScript 本书重点介绍的内容 也是JavaScript的客户端应用 当一个Web浏览器嵌入了JavaScript解释器时 它就允许可执行的内容以JavaScript的形式在用户客户端浏览器中运行 精通HTML CSS14 100 网页设计与制作密码 14 1 4客户端JavaScript的特性 JavaScript是一种基于对象 Object 和事件驱动 EventDriven 并具有安全性能的脚本语言 使用它的目的是与HTML超文本标记语言 Java脚本语言 Java小程序 一起实现在一个Web页面中连接多个对象 与Web客户交互作用 从而可以开发客户端的应用程序等 它是通过嵌入或调入到标准的HTML语言中实现的 JavaScript具有以下几个基本特点 1 是一种脚本编写语言 2 基于对象的语言 14 简单性 4 安全性 5 动态性的 6 跨平台性 精通HTML CSS14 100 网页设计与制作密码 14 2最常用的开发工具 14 2 1附带测试的开发工具 TestSwarm14 2 2半自动化开发工具 Minimee14 2 3轻松建立JS库的开发工具 JavaScriptBoilerplate 精通HTML CSS14 100 网页设计与制作密码 14 2 1附带测试的开发工具 TestSwarm 提起客户端那么就一定有相应的服务器端 而JavaScript主要是应用在客户端 JavaScript服务器端最早实现动态网页的技术是CGI CommonGatewayInterface 通用网关接口 技术 它可根据用户的HTTP请求数据动态从Web服务器返回请求的页面 精通HTML CSS14 100 网页设计与制作密码 14 2 2半自动化开发工具 Minimee 在互联网领域 速度就是一切 这意味着当面对CSS和JavaScript文件的时候 文件大小是一个重要的要素 Minimee可以自动最小化以及并对文件进行组合 帮助你化繁为简 下载地址为 http johndwells github io Minimee 精通HTML CSS14 100 网页设计与制作密码 14 2 3轻松建立JS库的开发工具 JavaScriptBoilerplate JavaScriptBoilerplate是基于HTML CSS JS的一个快速 健壮和面向未来的网站模板 经过14年的迭代开发 得到最佳的Web开发实践 包括 跨浏览器的正常化 性能优化 甚至像可选功能如AJAX跨域和Flash处理等 这个模版包含一个 htaccess配置文件 它的功能包括Apache缓存设置 网站播放HTML5视频设置 使用 font face和允许使用gzip设置 精通HTML CSS14 100 网页设计与制作密码 2020 2 5 11 14 35个最常用的JavaScript调试工具 14 3 1万能调试工具 Drosera14 3 2最规则的调试工具 Dragonfly14 3 3Firefox的集成工具 Firebug14 3 4前端调试利器 Debugbar14 3 5支持浏览器最多的工具 Venkman 精通HTML CSS14 100 网页设计与制作密码 14 3 1万能调试工具 Drosera Drosera可以调试任何基于WebKit的应用 精通HTML CSS14 100 网页设计与制作密码 14 3 2最规则的调试工具 Dragonfly Dragonfly可以语法和断点高亮显示 搜索功能强大 可以搜索当前选择的脚本 可以用文本 正则表达式来加载所有的JavaScript文件 精通HTML CSS14 100 网页设计与制作密码 14 3 3Firefox的集成工具 Firebug FireFox集成了Firebug 它提供了一个丰富的Web开发工具 可以在任何网页编辑 调试和监控的CSS HTML和JavaScript 精通HTML CSS14 100 网页设计与制作密码 14 3 4前端调试利器 Debugbar Debugbar虽然可以与Firebug一样获取页面元素 做源代码调试和CSS调试 精通HTML CSS14 100 网页设计与制作密码 14 3 5支持浏览器最多的工具 Venkman Venkman是Mozilla的JavaScriptdegugger的代码名称 可以在用户界面上和控制台命令中使用断点管理 调用栈检查 变量 对象检查等功能 可以让你以最习惯的方式调试 精通HTML CSS14 100 网页设计与制作密码 14 4综合实战1 用JavaScript计算借贷支出 精通HTML C