回顧:
js:
    組成部分:
        ECMAScript
        BOM
        DOM
變數宣告 var 變數名=初始化值;
資料型別:
        原始型別
            Undefined Null
            String Number Boolean:偽物件
            通過typeof運算子可以判斷出屬於那種原始型別
                typeof 值|變數
        引用型別
            Boolean Number
            String 
                常用屬性:length
                常用方法:
                    substring
                    split
                    replace
            Array
                常用屬性:length
                注意:
                    array長度可以變化
                    array可以存放任意值
            Math
            Date
            RegExp    常用方法:test()
                直接量語法:
                    /正則表示式/
            全域性
                decodeURI 解碼
                eval 計算字串,解析成js程式碼執行
運算子:
    關係運算符
    等性運算子 ==  ===
語句:
    選擇 迴圈
////////////////////////////////
BOM(瀏覽器物件模型)
    window:視窗
        常用屬性:
            獲取其他的四個物件
                window.location....
        常用方法:
            訊息框
                alert confirm prompt
            定時器
                setInterval 週期
                setTimeout 延遲
            開啟關閉 
                open close
    location:定位
        location.href:設定或者獲取url
    history:歷史
        go()
///////////////////////////////
事件和函式
    掌握的事件:
        焦點:
            onfocus
            onblur
        表單事件
            onsubmit
            onchange 改變
        頁面或者元素載入
            onload 
                最常用的方式:
                    window.onload=function(){};
        單擊
            onclick
    函式:
        方式1:
            function 函式名(引數列表){
                函式體
            }
        方式2:
            匿名函式
            例如:window.onload=function(){};
        
事件繫結函式:
    方式1:通過元素的事件屬性
        
 
<xxx onxxx="函式名(引數)">  若引數為this:是將當前的dom物件傳遞給了函式
    方式2:派發事件
        dom物件.onxxx=function(){};
///////////////////////////////////////////
DOM(文件物件模型)
    就是我們的html程式碼載入到記憶體中會形成一棵document樹
    節點:
        文件節點 document
        元素節點 element
        屬性節點 attribute
        文字節點 text
    獲取一個元素節點:通過document獲取
        四個
    操作元素的屬性
        dom物件.屬性
    操作元素的標籤體
        dom物件.innerHTML
////////////////////////
以前通過js獲取物件的時候
    var obj=document.getElementById("id");
    
    funtion getId(id){
        return document.getElementById("id");
    }
    
    $("選擇器")===>獲取元素
//////////////////////////
js類庫:
    對常用的方法和物件進行封裝,方便我們使用.
jQuery:
案例1-彈出廣告
技術:
    定時器
    jQuery
///////////////////////////
jquery和html的整合
    jquery是單獨的js檔案
        通過script標籤的src屬性匯入即可
獲取一個jquery物件
    $("選擇器")  或者 jQuery("選擇器")
dom物件和jquery物件之間的轉換
    dom物件===>jquery物件    
        $(dom物件)
    jquery物件===>dom物件
        方式1:
            jquery物件[index]
        方式2:
            jquery物件.get(index)
頁面載入:
    js:
        window.onload=function(){}//在一個頁面中只能使用一次
    jquery 在一個頁面中可以使用多次
        方式1:
            $(function(){...})
        方式2:
            $(document).ready(function(){});
派發事件:
    $("選擇器").click(function(){...});
    等價於 原生js中
        dom物件.onclick=function(){....}
    掌握事件:
        focus
        blur
        submit
        change
        click
jquery中效果:
    隱藏或展示
        show(毫秒數) hide(毫秒數)
    滑入或滑出
        slideDown(毫秒數):向下滑入
        slideUp(毫秒數):向上滑出
    淡入或淡出
        fadeIn(int):淡入
        fadeOut(int):淡出
/////////////////////
案例1-步驟分析
    1.頁面載入成功之後$(function(){...}) 開始一個定時器 setTimeout();
    2.編寫展示廣告方法 
        獲取div,然後呼叫效果方法
        設定另一個定時器 隱藏
    3.編寫隱藏廣告的方法
        獲取div,然後呼叫效果方法
////////////////////////////////////
選擇器總結:
    基本選擇器★
        $("#id值")  $(".class值")  $("標籤名")  
        
        瞭解:$("*")
        理解:獲取多個選擇器 用逗號隔開
            $("#id值,.class值")
    層次選擇器 ★
        a b:a的所有b後代
        a>b:a的所有b孩子
        a+b:a的下一個兄弟(大弟弟)
        a~b:a的所有弟弟
    基本過濾選擇器:★
        :frist 第一個
        :last 最後一個
        :odd  索引奇數
        :even 索引偶數
        :eq(index) 指定索引
        :gt(index) >
        :lt(index) 
 
<
    內容過濾:
        :has("選擇器"):包含指定選擇器的元素
    可見過濾:
        :hidden   在頁面不展示元素 一般指 input type="hidden" 和 樣式中display:none
        :visible 
    屬性過濾器:★
        [屬性名]
        [屬性名="值"]
    表單過濾:
        :input  所有的表單子標籤  input select textarea button
        //input
////////////////////////
案例2-隔行換色
技術分析:
    1.頁面載入成功
    2.獲取所有的奇數行 新增一個css
    3.獲取所有的偶數行 新增一個css

屬性和css操作總結:
    對屬性的操作:
        attr():設定或者獲取元素的屬性
            方式1:獲取
                attr("屬性名稱")
            方式2:設定一個屬性
                attr("屬性名稱","值");
            方式3:設定多個屬性  json
                attr({
                    "屬性1":"值1",
                    "屬性2":"值2"
                })
        removeAttr("屬性名稱"):移除指定屬性
    //新增class屬性的時候 
    //    attr("class","值");
    addClass("指定的樣式值"); 相當於 attr("class","指定的樣式值");
    removeClass("指定的樣式值");

    對css操作:操作元素的style屬性
        css():獲取或者設定css樣式
            方式1:獲取    
                css("屬性名")
            方式2:設定一個屬性
                css("屬性名","值")
            方式3:設定多個
                css({
                    "屬性1":"值1",
                    "屬性2":"值2"
                });
    獲取元素的尺寸:
        width()
        height()
/////////////////////////////
案例3-全選或者全不選
需求:
    就是將內容中複選框的選中狀態和最上面的複選框狀態保持一致
步驟分析:
    1.確定事件 複選框的單擊事件
    2.函式中
        a.獲取該複選框的選中狀態  attr(獲取不了checked屬性)|prop
        b.獲取所有的複選框修改他們的狀態
注意:
    若jquery版本
 
>1.6 統一使用 prop操作元素的屬性
/////////////////////////
/////////////////////////
/////////////////////////
/////////////////////////
案例4-省市聯動
步驟分析:
    1.確定事件 省份的下拉選變化的時候  change
    2.編寫函式
        a.獲取當前省份的value值
        b.通過陣列獲取該省下的所有市 返回值:陣列
        c.遍歷陣列,拼裝成option元素 追加到市下拉選即可
        注意:每次改變的時候初始化市的值.
///////////////////////////
技術:
    遍歷陣列
        陣列.each(function(){});
        $.each(遍歷陣列,function(){});
        
    注意:
        each的function中可以加兩個引數 index和dom
            index是當前遍歷的索引值
            dom指代的是當前遍歷的dom物件(開發中一般使用this即可)
    //////////////////////////////
    設定或者獲取value屬性
        jquery物件.val():獲取
        jquery物件.val("...."):設定
    /////////////////////////////////////////
    設定獲取獲取標籤體的內容 
        html()
        text()
        
        xxxxx():獲取標籤體的內容
        xxxxx("....."):設定標籤體的內容
            
            設定的區別:
                html:會把字串解析
                text:只做為普通的字串
            獲取的區別:
                html:獲取的html原始碼
                text:獲取只是頁面展示的內容
    //////////////////////////////////////////////
建立一個元素: $("<標籤></標籤>")
///////////////////////
文件操作:
    內部插入
        a.append(c):將c插入到a的內部(標籤體)後面
        a.prepend(c):將c插入到a的內部的前面
        
        appendTo
        prependTo
    外部插入
        a.after(c):將c放到a的後面
        a.before(c):將c放到a的前面
        
        a.insertAfter(c)
        a.insertBefore(c)
    刪除
        empty() 清空元素
        remove() 刪除元素
/////////////////////////////////
/////////////////////////////////
/////////////////////////////////
案例5-左右移動
步驟分析:
    1.確定事件 單擊事件
    2.編寫函式:
        移動一個:
            右邊的下拉選追加一個 左邊的選中的第一個
        移動多個:
            左邊選中的 追加到右邊的下拉選中
        移動全部:
            將左邊的所有option追加到右邊的下拉選中
        
技術分析:
    表單物件屬性過濾選擇器
        :enabled   可用的
        :disabled  不可用
        :checked     選中的(針對於單選框和複選框的)
        :selected     選中的(針對於下拉選)














///////////////////////////////////////////////////

///////////////////////////////////////////////////
///////////////////////////////////////////////////
上午回顧:
js類庫:
    對常見的方法和物件進行了封裝,方便開發.
jquery和html的整合
    script標籤的src屬性匯入即可
獲取jquery物件
    $("選擇器")  jQuery("選擇器")
dom物件和jquery物件之間的轉換
    dom>>>jquery    
        $(dom物件)
    jquery>>>dom
        方式1:
            jquery物件[index]
        方式2:
            jquery物件.get(index)
jquery中的選擇器:
    基本選擇器★
        $("#id值") $(".class值") $("標籤名")  $("#one,#two,.mini")
    層次選擇器★
        a b:後代
        a>b:孩子
        a+b:大弟弟
        a~b:弟弟們
        
    基本過濾選擇器
        :frist :last
        :odd :even
        :eq(index) :gt|lt..
    內容過濾
        :has(選擇器)
    可見性過濾
        :visible
        :hidden 指代是 input type=hidden  和 display:none
    表單的過濾
        :input
    屬性選擇器:
        [屬性]
        [屬性=值]
    表單物件屬性過濾選擇器
        :enabled   可用的
        :disabled  不可用
        :checked     選中的(針對於單選框和複選框的)
        ★:selected     選中的(針對於下拉選)
    
///////////////////////////
派發事件:
        jquery物件.事件(function(){.....});
        例如:
            $("#btn1").click(function(){.....});
/////////////////////////
頁面載入成功
    $(function(){
        ......
    })
    
    $(document).ready(function(){
        ////
    });
///////////////////////////
屬性和css
    attr():設定或者獲取屬性(1.6版本之前)
        attr("屬性名"):獲取
        attr("屬性名","值"):設定一個        
        attr({
            "屬性名":"值",
            "屬性名":"值" 
        })
        
    prop():和attr用法一致(1.6版本之後)
    
    (瞭解)addClass("存在的樣式")
    
    removeAttr()
    (瞭解)removeClass()
    
    css():設定獲取獲取元素的樣式
        css("屬性"):獲取
        css("屬性","值"):設定
        css({
            "":"",
            "":"",
            "":""
        }):設定多個
    
    width()
    height()
/////////////////////////////////////
    文件處理:
        內部插入(2組方法 任意掌握一組)
        外部插入(2組方法 任意掌握一組)
        刪除(empty remove)
//////////////
val html text
        val :設定或者獲取values屬性
        html:獲取或者設定標籤體內容
////////////////////
遍歷陣列
    方式1:
        jquery物件.each(function(){});
    方式1:
        $.each(jquery物件,function(){});
/////////////////////////
在jquery中建立元素
    $("<標籤名>").prop(屬性).html(內容)
////////////////////////////