web前端开发技术实验与实践(读书笔记)

在这里插入图片描述

书籍介绍:

本书根据了web前端开发所需的知识,规划了12次实验,设计了36个实验项目,将CSS技术贯穿所有的实验项目,实现了HTML、CSS、DIV、JavaScript、DOM完全地融会。全书分为上下两篇。上篇为实验(课内实验),包括HTML基础(Web前端开发环境配置、HTML基本语法、文本格式化、列表、超链接、多媒体应用)、页面布局技术(CSS+DIV、表格、框架、表单)、基础(基本语法、程序结构、事件分析、DOM与BOM)、Web前端开发工具4个部分,内含12次实验36个实验项目。下篇为实践(课程设计),包括高校网络课程网站、商业网站设计与开发2个典型案例和其他自选案例的介绍。

主要内容:

  1. HTML基础:
    讲解了web前端的开发环境的配置、HTML基础语法、标记语法;介绍了文本标记、段落与排版标记、列表及多媒体标记的应用。
    2. 页面布局技术
    将表格、框架、表单三大传统的页面技术与CSS+DIV页面布局技术组合在一起,充分讲解了在实际工程中的应用。
    3. JavaScript基础
    讲解了JavaScript基本语法、组成结构、程序结构、函数编程方式;运用JavaScript的DOM与BOM技术解决了web网站设计中用户互动页面的设计方法。
    4. web前端开发工具
    介绍了常用的web前端开发工具的基本功能
    5. 网站设计
    以高校网络课程网站和商业网站为典型案例,详细介绍每类网站功能概况、网站页面布局分析、CSS+DIV结构设计、导航菜单设计技术及网站页面开发基本要素和设计步骤。

读书笔记

这本书适合对HTML、CSS、JavaScript有着初步认识的人学习阅读。这本书的理论知识相对来说偏少,主要以锻炼动手实践能力。在有一定web前端知识储备的前提下,在运用这书练手,有助于对web前端的深一步认识。本书主要将例子步骤拆分化,先分成多个小碎片,带我们实现,最后再整合到一起实现。每个实验都会有好几个项目的讲解,在实验结尾会给出每个项目的完整代码。在这里,我们最好先自己根据前面给出的网页效果图敲出代码,再和书上给出的代码对比一下。有利于发现我们的不足与区别。相信很多人一开始学习web前端时和我差不多都只是掌握了基本的理论知识,但是不知道怎么用在实际的应用中。而这本书可以带我们实践一下,让那些我们日常可以看到的网页效果在我们手上同样可以出产。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Web应用前端技术的探索与实践 1 1 前端开发那些事 1 2 怎样提高前端的质量和工作效率? 1 附件(关于2011年工作的一点浅见) 3 3 探讨一些技术问题 4 3.1 Frameset和iframe 4 3.2 Frameset和Div两种方式的对比 5 3.2.1 frameset布局的优点 5 3.2.2 frameset布局的缺点 5 3.2.3 DIV传统布局与frameset相比的优点 5 3.2.4 DIV传统布局与frameset相比的缺点与解决办法 6 3.2.5 大量使用ajax的DIV局部页面,会遇到的一些难点 6 3.2.6 解决方法 6 3.2.7 结论 6 3.3 基于DIV的网页布局-模版的核心 7 3.3.1 概述 7 3.3.2 简单、直观的DIV布局 7 3.3.3 DIV布局问题的终极解决方案 9 3.3.4 解决DIV被撑爆的问题 12 3.3.4.1 DIV撑爆的问题 12 3.3.4.2 图片撑爆问题的解决办法 13 3.3.4.3 文字撑爆问题的解决办法 13 3.4 Java Web应用的DIV布局 14 4 主流邮件系统前端开发的研究 19 4.1 21cn企业邮 19 4.2 Sohu邮箱 21 4.3 网易邮箱 30 4.4 腾讯网络邮箱(foxmail) 40 4.5 新浪邮箱 47 4.6 关于邮箱业务的题外话 49 4.7 小结 51 5 一些应用的问题 51 5.1 21cn.com 51 5.2 综合管理平台 51 5.2.1 文件组织 51 5.2.2 UI 53 5.2.3 Jsp文件胡乱包含 53 6 前端组件及其研发的探索和实践 54 6.1 用户、应用 55 6.2 网站和web应用公共组件的层次 55 6.3 Web应用前端组件的研发原则 56 6.4 研发流程 56 6.5 常用前端组件的分析和研究 57 6.5.1 概述 57 6.5.2 通用组件 58 6.5.2.1 Accordion 58 6.5.2.1.1 效果 59 6.5.2.1.2 参数说明 60 6.5.2.2 Tab 61 6.5.2.2.1 效果 61 6.5.2.2.2 参数说明 64 6.5.2.2.3 事件说明 64 6.5.2.2.4 方法说明 65 6.5.2.2.5 属性说明 65 6.5.2.3 封装Accordion和Tab为Switchable 65 6.5.2.3.1 使用JQuery Tools构建 67 6.5.2.3.2 JQuery Tools的Switchable对Ajax的支持 68 6.5.2.3.3 使用JQuery Switchable 70 6.5.2.3.4 使用kissy Switchable 78 6.5.2.4 统计分析图表组件 94 6.5.2.4.1 应用实例1 95 6.5.2.4.2 应用实例2 97 6.5.2.5 DataGrid1-浏览表格数据 102 6.5.2.5.1 效果 103 6.5.2.5.2 参数说明 107 6.5.2.6 DataGrid2-可编辑cell 110 6.5.2.6.1 效果 110 6.5.2.7 DataGrid3-控制列是否显示 113 6.5.2.7.1 效果 113 6.5.2.8 Tree 116 6.5.2.8.1 效果1 116 6.5.2.8.2 效果2 117 6.5.2.9 树表组件 121 6.5.2.9.1 TABLETREE4J 121 6.5.2.9.2 JQuery TreeGrid 124 6.5.2.10 Combo扩展1-去除IE6下穿透层的bug 129 6.5.2.10.1 效果 130 6.5.2.11 Combo扩展2-新样式、可多选 131 6.5.2.11.1 效果 131 6.5.2.12 Combo扩展3-ComboGrid 134 6.5.2.12.1 效果 134 6.5.2.13 Combo扩展4-ComboTree 137 6.5.2.13.1 效果 137 6.5.2.14 日期-时间选择 139 6.5.2.14.1 基于JQuery EasyUI的日期选择组件 139 6.5.2.14.2 My97DatePicker 142 6.5.2.15 TimeSpinner 146 6.5.2.15.1 效果 146 6.5.2.15.2 应用 147 6.5.2.16 NumberSpinner 148 6.5.2.16.1 效果 148 6.5.2.17 MenuButton 149 6.5.2.17.1 效果 149 6.5.2.18 分页组件Pagination 151 6.5.2.18.1 效果 151 6.5.2.18.2 参数说明 152 6.5.2.19 文件上传组件 153 6.5.2.19.1 uploadify 153 6.5.2.19.2 swfUpload 159 6.5.2.20 消息提示、弹出广告组件 162 6.5.2.20.1 效果 162 6.5.2.20.2 方法说明 165 6.5.2.20.3 扩展说明 166 6.5.2.21 Panel组件 166 6.5.2.21.1 效果 166 6.5.2.21.2 参数说明 168 6.5.2.21.3 事件说明 169 6.5.2.21.4 方法说明 170 6.5.2.22 Window组件 170 6.5.2.22.1 效果 170 6.5.2.22.2 使用说明 172 6.5.2.23 Form数据验证 173 6.5.2.23.1 效果 173 6.5.2.24 内容自动完成、Suggest 174 6.5.2.24.1 效果 175 6.5.2.24.2 应用说明 176 6.5.2.25 WYSIWYG在线Html内容编辑器 179 6.5.2.25.1 SinaEditor 179 6.5.2.25.2 CKEditor 181 6.5.2.26 JMesa 184 6.5.2.26.1 效果 185 6.5.2.26.2 一个较为复杂的应用实例 185 6.5.3 综合实例 191 6.5.3.1 Portal 191 6.5.4 展望 195 7 前端页面的优化工作概论 195 7.1 前端页面优化的策略 196 7.2 网站加速的主要方法 198 7.2.1 Web层 198 7.2.2 应用层 203 8 总结 205

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值