玩了好几天，玩的也好累了，天天打dota，打cf，和弟弟两个人开黑，然后老是被杀，弄得英雄1200的初始积分被我刷到了1分，看来我真的不是玩游戏这块料，算了，算了，看点书吧，大家新年快乐。

           7.1BOM之源---window对象

           基础知识：BOM是（Browser Object Model--浏览器对象模型），由于浏览器是javascript程序的宿主，所以window对象，以及有它产生的对象都称为宿主对象，它们包括（document，location，navigator，event，history，screen等）。

           如果看过我前面的文章的话，肯定会记得一个打印机的效果，它就是用setInterval()和clearInterval()----定时器，还有setTimeout()和clearTimeout()方法实现延迟调用，用这两对方法的时候注意估计一下函数执行时间，如果调用的函数执行的时间超过间隔期就会导致不可预知的问题。

           基本的交互操作：

           1. 警告对话框----alert(msg);--这个没啥好说的呢，总应该都会的吧

           2. 确认对话框----confirm(msg);--弹出消息提示框，有是否选项，该方法返回true就是“是”，false就是“否”。

           3. 提示输入消息对话框---prompt(msg,[input]);--该方法的返回值是一个整数或者一个字符串，表示用户输入的消息。（用的挺少的）

           4. 增强的交互式对话框---showModalDialog(sURL[, vArguments])---很强大，可以参考这篇文章JS中showModalDialog 详细使用,个人感觉现在这种方式用的挺少的，貌似记得好像有注入风险，只是有那么个印象，也不知道对不对，反正我是不太用的

           5. 我自己的办法：在[原创]银行MIS系统前台开发总结（3）-dataTable控件应用2中也有用到，其实很简单，但是依赖了easyui这个控件，其他控件也有类似的办法，看一下下面的代码：

          window.open---打开新窗口，window.close关闭当前窗口，window.focus使窗口获取焦点。

           7.2 BOM基本应用—管理浏览历史、解析地址和获取浏览器信息

               1. history（历史）对象指浏览器的浏览历史，使用该对象的方法和属性，就可以自定义前进和后退功能，具体可以使用以下几个：

                        back()--表示后退，语法格式为history.back([num])，参数num可选，如果没有参数，则默认倒退一步。

                        forward()--表示前进，该方法没有参数

                        go()--跳转到一个特定的地址，语法格式为history.go([location]);参数location可以是整数或者是URL字符串，正数是前进，负数时后                              退，0表示刷新当前页，与location.reload()等效。

               2. location对象--很重要的一个对象，使用console.log(window.location);就会得到下面的一系列信息：

               接下来你就可以通过location.获取各个属性，location.XXX()获取各个方法。

             3.navigator对象 ，使用console.log(window.navigator);查看一些该类的各个方法和属性，然后需要的话调用就行了。一般用来检测浏览器的。

     7.3 客户端数据存储技术

              Web存储机制是一种通过字符串形式的key/value对来安全地存储和使用数据的方法。

             1. 本地存储--localStorage，没有时间限制的数据存储。

                 使用非常简单，按照名值对的形式获取和赋值，如下代码：    

              如果是用chorme浏览器的话，按一下f12，在Resources下的Local Storage下就可以看到博客园下博文临时存储key为DraftBody，里面存储的value值为文章临时信息，key为DraftTitle，里面存储的是博文title。（我指的是你用网页编译器发表博文）。

                还有一个浏览器兼容问题，较早版本的FireFox没有实现localStorage，但它提供了globalStorage属性用于为指定域创建本地存储区域。如下代码实现兼容：

            2. 会话存储--sessionStorage，针对一个会话期的数据存储。

                 sessionStorage针对一个Session进行数据存储，当用户关闭浏览器窗口后，数据会被删除。用法与localStorage相同，可以用户提交表单错误时恢复有效数据。

           3. Storage接口--HTML 5规定window.sessionStorage和window.localStorage属性返回的数据类型都是Storage

               setItem(key,value)--设置key和value值

               getItem(key)--通过key获取value值

               removeItem(key)--删除value值

               oStorage.clear()--清除所有key/value对

               oStorage.key(index)--获取key值。

             3. Web SQL Database

                 （1）使用window对象的window.openDatabase()方法可以再网页内创建和使用Web SQL Database。

                 （2）执行SQL操作：

                           1）Database.transaction(callback[,errorCallback[, successCallback]]);允许执行读写操作

                           2) Database.readTransaction(callback[,errorCallback[, successCallback]]);仅允许执行读操作

                              参数callback定义一个事物操作要执行的回调函数，该函数内执行的SQL操作都是事物的，要么全部成功，要么全部失败。

                              参数errorCallback可选，定义一个事物操作失败时要执行的回调函数，需要一个参数，参数是SQLError对象。

                              参数successCallback可选，定义一个事物操作成功时要执行的回调函数，该回调函数没有参数。

                 （3） 执行SQL语句：

                            SQLTransaction对象定义了executeSql()方法用于执行SQL操作，语法格式：

本文链接

CSS如何实现数字分页效果:
建议:尽可能的手写代码，可以有效的提高学习效率和深度。
相当数量的网站都使用数字分页效果，例如本站的分页也是采用此方式，还算是比较美观使用吧。
代码实例如下: