BOM编程(内含复选框全选全不选举例)

1.BOM模型简介

        1.1 Browser Object Model的缩写，  简称浏览器对象模型

        1.2 BOM结构:

           顶层对象:window(窗口)

             一级子对象：history(历史记录) -->Ctrl+H、
document(文档)、

location(地址栏)

            二级子对象：包含在document(文档)内部    

            ……

2.history对象

        2.1 back()-->返回前一个历史记录地址

        2.2 forward()-->返回后一个历史记录的地址

        2.3 go(n)-->返回前（后）一个历史记录地址

                    举例：go(-1)与back()等效

                               go(1)与forward()等效

3.location对象

        href属性-->  设置或获取当前地址栏的信息

       reload()-->  重新载入网页,相当于F5刷新

4.document对象

         a)getElementById("id值")-->通过id属性的值获取该元素的对象

         b)getElementsByName("name值")-->获取name属性值相同的元素数组

          c)getElementsByTagName("标签名")-->获取指定标签名的元素数组

           d)getElementsByClassName("class属性值")-->获取class属性值相同的元素数组

5.元素的显示和隐藏

        5.1 display样式

        语法:元素.style.display="值"

        注意：值填写block时表示显示(前后带换行符);

         值填写inline时表示显示(前后不带换行符)

        值填写none时表示隐藏(不留空位)

        5.2 visibility样式

        语法：元素.style.visibility = "值"

         注意：值填写visible时表示显示;

                    值填写hidden时表示隐藏(留存空位)

6.复选框全选/全不选特效

    6.1 复选框的选中/不选中:

        复选框.checked=true;//选中

        复选框.checked=false;//不选中

   6.2 多个复选框设计相同的name;

            通过getElementsByName()方法获取复选框数组

7.下面是全选全不选的特效展示页面

下面是关键代码的实现:

接下来是网页的一些代码:

以上是小编今天的介绍,要是有什么疑问,或者小编有什么不足之处,都可以加小编微信,小编很乐意为你解答!