一、三種循環(huán)

1. for(初始化; 條件; 增量){}
2. while(條件) { 語(yǔ)句 } 可能會(huì)不執(zhí)行
3. do {} while() 至少執(zhí)行一次
   二、多分支語(yǔ)句
   switch(參數(shù))
   {
   case 參數(shù)1：
   語(yǔ)句;
   break; 退出的意思
   case 參數(shù)2：
   語(yǔ)句;
   break; 退出的意思
   ........
   default: 默認(rèn)的
   語(yǔ)句;
   }
   效率比if else 更高
   三、onchange事件
   拉菜單的事件 onchange
   sele.onchange = function(){}
   當(dāng)下拉內(nèi)容改變的時(shí)候 事件發(fā)生
   四、數(shù)組

1.添加數(shù)組
用法例如 arr.push(1)
(1) push()
push() 方法可向數(shù)組的末尾添加一個(gè)或多個(gè)元素，返回新的長(zhǎng)度。 push 推進(jìn)去

var dom = [1,3,5];
console.log(dom.push(7));  // 返回的是 數(shù)組的長(zhǎng)度  4

(2) unshift() 可向數(shù)組的開頭添加一個(gè)或更多元素，并返回新的長(zhǎng)度。

2.刪除數(shù)組
(1) pop() 刪除最后一個(gè)元素 返回值 是 返回最后一個(gè)值
(2) shift() 用于把數(shù)組的第一個(gè)元素從其中刪除，并返回第一個(gè)元素的值

3.連接兩個(gè)數(shù)組
contact () arr1.contact(arr2)

4.join() 把數(shù)組轉(zhuǎn)換為字符串
作用是將數(shù)組各個(gè)元素是通過(guò)指定的分隔符進(jìn)行連接成為一個(gè)字符串。
數(shù)組本身是不會(huì)改變的。
arr.join(符號(hào));

var arr = [1,2,3];
console.log(arr.join(“-”))    結(jié)果就是：  1-2-3    //字符串

5.把字符串轉(zhuǎn)換為數(shù)組 split()

stringObject.split(separator,howmany)
參數(shù) separator 可選。指定要使用的分隔符。如果省略該參數(shù)，則使用逗號(hào)作為分隔符。
howmany 可選。該參數(shù)可指定返回的數(shù)組的最大長(zhǎng)度

例：

var txt ="aa-bb-cc";
console.log(txt.split("-")) ;  
// 結(jié)果是  ["aa","bb","cc"]
// 兩處的符號(hào)要保持一致 

五、DOM
1.我們js 有三部分組成的？

核心（ECMAScript）歐洲計(jì)算機(jī)制造商協(xié)會(huì)
描述了JS的語(yǔ)法和基本對(duì)象。 var aa var AA 不一樣

文檔對(duì)象模型（DOM） 學(xué)習(xí)的重點(diǎn)
處理網(wǎng)頁(yè)內(nèi)容的方法和接口

瀏覽器對(duì)象模型（BOM） 了解一下
與瀏覽器交互的方法和接口
window.alert() 有很大的的兼容問(wèn)題

2. DOM
   （1）定義：為文檔提供結(jié)構(gòu)化顯示，定義了如何通過(guò)腳本訪問(wèn)文檔結(jié)構(gòu)，為了讓js操作html而定義的規(guī)范。
   通過(guò)dom來(lái)訪問(wèn)的頁(yè)面中的每一個(gè)標(biāo)簽，每個(gè)標(biāo)簽都是一個(gè)dom對(duì)象。
   （2）節(jié)點(diǎn)
   標(biāo)簽標(biāo)記元素 都是節(jié)點(diǎn)
   由結(jié)構(gòu)圖中我們可以看到，整個(gè)文檔就是一個(gè)文檔節(jié)點(diǎn)。
   每一個(gè)HMTL標(biāo)簽都是一個(gè)元素節(jié)點(diǎn)。
   標(biāo)簽中的文字則是文字節(jié)點(diǎn)。
   標(biāo)簽的屬性是屬性節(jié)點(diǎn)。
   一切都是節(jié)點(diǎn)……
   （3）訪問(wèn)節(jié)點(diǎn)
   getElementById() id 訪問(wèn)節(jié)點(diǎn)
   getElementsByTagName() 標(biāo)簽訪問(wèn)節(jié)點(diǎn)
   getElementsByClassName() 類名 （有兼容性問(wèn)題，主流瀏覽器支持 ie 67 8 不認(rèn)識(shí) 解決：自己封裝自己的類 。）
   3.封裝class類
   取出所有盒子進(jìn)行遍歷，通過(guò)每個(gè)盒子的classname判斷。

<script>
    window.onload = function(){
       //封裝自己class類名
        function getClass(classname){
            //如果瀏覽器支持，則直接返回
            if(document.getElementsByClassName)
            {
                return document.getElementsByClassName(classname);
            }
            // 不支持的 瀏覽器
            var arr = []; // 用于存放滿足的數(shù)組
            var dom = document.getElementsByTagName("*");
            //alert(dom.length);
            for(var i=0;i<dom.length;i++)
            {
                if(dom[i].className == classname)
                {
                    arr.push(dom[i]);
                }
            }
            return arr;
        }
        console.log(getClass("demo").length);
    }
</script>

分割：

4.判斷真假
數(shù)字類型 所有數(shù)字都是真，0是假
字符串 所有字符串都是真，’ ’串是假
對(duì)象 所有對(duì)象都是真，null是假
未定義 undefined是假，沒有真

六、訪問(wèn)關(guān)系
1.

圖片1.png

<script>
    window.onload = function(){
        var x = document.getElementById("x");
        x.onclick = function(){
            this.parentNode.style.display = "none";
            // 關(guān)掉的是他的 父親
        }
    }
</script>

2.兄弟節(jié)點(diǎn)
nextSibiling 親的 下一個(gè)兄弟 ie678認(rèn)識(shí)。
nextElementSibling 其他瀏覽器認(rèn)識(shí)。
previousSibling 親的 上一個(gè)兄弟
previousElementSibling
可以合著寫 用 || 必須先寫正常瀏覽器 后寫 ie678 。
3.子節(jié)點(diǎn)
基本上不用，容易出問(wèn)題，因?yàn)榭崭褚矔?huì)被當(dāng)作孩子。
firstChild 第一個(gè)孩子 ie678。
firstElementChild 第一個(gè)孩子 正常瀏覽器 。
lastChild
lastElementChild
4.孩子節(jié)點(diǎn)
childNodes：選出全部孩子
它是標(biāo)準(zhǔn)屬性，它返回指定元素的子元素集合，包括HTML節(jié)點(diǎn)，所有屬性，文本節(jié)點(diǎn) （嫡出）火狐 谷歌等高本版會(huì)把換行也看做是子節(jié)點(diǎn)。
利用 nodeType == 1 來(lái)獲取元素節(jié)點(diǎn)！！

   nodeType == 1    元素節(jié)點(diǎn)     
   nodeType == 2    屬性節(jié)點(diǎn)
   nodeType == 3    文本節(jié)點(diǎn) 

children ：（庶出）常用， 選取所有孩子，只包含元素節(jié)點(diǎn)！
在ie678里注釋也是節(jié)點(diǎn)。
七、dom里的節(jié)點(diǎn)操作
1.新建節(jié)點(diǎn)

var demo = document.getElementById("demo");
var a = document.createElement("li"); //生成一個(gè)新的li標(biāo)簽

2.插入節(jié)點(diǎn)
(1) appendChild(); 意思： 添加孩子 放到盒子的最后面。

demo.appendChild("a"); //在demo后添加了一個(gè)li標(biāo)簽  

(2) insertBefore (插入的節(jié)點(diǎn)，參照節(jié)點(diǎn))

demo.insertBefore(test,childrens[0]);
//放到第一個(gè)孩子的前面，在第一個(gè)孩子前面插入一個(gè)節(jié)點(diǎn)test

demo.insertBefore(test,null);//如果第二個(gè)參數(shù)為null  則默認(rèn)這新生成的盒子放到最后面。

3.刪除節(jié)點(diǎn)
removeChild() 孩子節(jié)點(diǎn)

var da = document.getElementById("xiongda");
demo.removeChild(da);

4.克隆節(jié)點(diǎn)
cloneNode();括號(hào)里放參數(shù)。
如果是true，深層復(fù)制：復(fù)制盒子和子節(jié)點(diǎn)。
如果是false只復(fù)制本節(jié)點(diǎn)。

var last = chidrens[0].cloneChild(true);
demo.appendChild(last);