Java script基礎 回顧

標籤：顯示   數組   strong   位置   調用   get   刪除   基礎   nbsp   

一、文法

代碼與C#相似，變數使用的是var引用出來，包含所有類型；可以直接使用，不用定義。

 也是有內建分類的。例如：var b="10"  var c=10;一個是字串一個是整型，c+c+a=2010;c+a+c=101010;如果前面是字串，後面的變數也會成字串

運算子

    數學運算子：+    -    *    /    %    ++    --；

    關係運算子：==    ！=    >=    <=    >    <；

    邏輯運算子：&&    ||    ！；

    其他運算子：+=    -=    *=    /=    %=    ？：；

語句

     一般分為順序、分支和迴圈語句。

    （1）分支語句：  if{}else{}   if{}else{}  

    （2）迴圈for語句：

數組

    數組的定義：new Array();    //它的長度是動態變化的，裡面可以放任意類型的元素。

    數組元素的賦值：a[0]=123; a[1]="hello";  //元素中的索引從0開始。

    數組的取值：a[i];

    數組屬性：a.length;    //數組元素的個數，長度。沒有count（）

    方法：a.sort(); //數組排序，按照每一個元素的第一個字元進行排序。

            a.reverse();  //翻轉數組。

函數

    函數的四要素：名稱、輸入、傳回值、加工。

    定義函數：function add(形參){函數體}     //函數名為add，輸入為參數的形式，傳回值可以是var類型，也可以return一個傳回值。

    匿名函數：function(){函數體}

    函數必須經過調用才能執行。函數的調用：add（實參）

二、對話方塊

1、alert("")：警告對話方塊，作用是彈出一個警告對話方塊

2、confirm("")：確定對話方塊，彈出一個帶確定和取消按鈕的對話方塊——確定返回true，取消返回false

3、primpt("要顯示的文字"):可以允許使用者輸入內容的對話方塊

 

三、Windows對象

（一）、

window.open("開啟的地址","開啟的位置")

window.opener:開啟此頁面的上一個頁面對象

window.close():關閉當前頁面

window.navigate("url") 跳轉至目標頁面（超連結），在Google瀏覽器下有bug；（不常用）

window.moveTo(x,y) 移動頁面至某一位置，位置由x和y決定；（不常用）

window.resizeTo(寬，高) 調整頁面的寬度和高度；（不常用）

window.scrollTo（x,y）滾動頁面至哪裡，y代表縱向滾動；（不常用）

（二）Window.history對象

window.history.back();頁面進行後退；——主要記住

window.history.forward();頁面前進；

window.history.go(n); n如果是正數則代表前進n個頁面，n如果是負數則代表後退n個頁面，一般常用這一種。 

（三）Window.location對象

location地址欄

window.location.href="http://www.baidu.com";修改頁面地址，會跳轉頁面（超連結）——主要記住

 重要的

四、Windows對象——window.document對象

它可以將Html中的元素提取到js裡面，然後對它進行各種各樣的操作

它是js中的核心中的核心

（一）取元素

      docunment.getElementById("id")；根據id找，最多找一個；

      docunment.getElementsByClassName("name") 根據classname找，找出來的是數組；注意中間是items不要忘了s

      docunment.getElementsByName("name")；根據name找，找出來的是數組；

      docunment.getElementsByTagName("name")；根據標籤名找，找出來的是數組；

註：id實在web端使用的，name實在服務端使用的

 

（二）操作內容

1、普通元素

取值：alert(a.innerHTML)——會將元素內的所有內容，包括元素標記都取出來

        alert(a.innerText)——只取裡面的文字，忽略所有被編譯元素

賦值：a.innerHTML = "<font color=red >hello world </font>"——如果內容有元素，編譯後實現

         a.innerText——會將賦的東西原樣呈現

2、變單元素

取值：var t = document.f1.t1——form表單ID為f1裡面的ID為t1的input；     

         var t = document.getElementById("id")—— 直接用ID擷取。

         alert(t.value)——擷取input中的value值；

賦值： t.value="內容改變"；

註：所有表單元素取值賦值都用value

（二）操作屬性

1、添加、修改屬性

        對象.setAttribute("屬性名稱","屬性值")——如果沒有此屬性會添加進去，相反，會修改此屬性的值

2、擷取屬性：

        對象.getAttribute("屬性名稱")——擷取屬性的值；

3、刪除屬性：

        對象.removeAttribute("屬性名稱")——移除一個屬性。

（三）操作樣式

1、添加、修改樣式

        對象.style.樣式名稱=值
2、擷取樣式

        var  ....=對象.style.樣式名稱  

（四）相關元素操作——寫通用特效用

var a = document.getElementById("id");找到a；

▲var b = a.nextSibling——找a的下一個同輩元素，注意包含空格；

▲var b = a.previousSibling——找a的上一個同輩元素，注意包含空格；

▲var b = a.parentNode——找a的上一級父級元素；

▲var b = a.childNodes——找出來的是數組，找a的下一級子項目；

▲var b = a.firstChild——第一個子項目，lastChild最後一個，childNodes[n]找第幾個；

▲alert(nodes[i] instanceof Text);——判斷是不是文本，是返回true，不是返回flase，用if判斷它的值是不是false，可以去除空格。

  

五、事件

1、onclick：按一下滑鼠觸發

     ondblclick：雙擊觸發

2、onmouseover：滑鼠移動上面觸發

     onmouseout：滑鼠離開時觸發

3、onblur：失去焦點時觸發

     onfocus：獲得焦點是觸發

4、onkeyup：按鍵抬起來的時候觸發

 

補：1、獲得某個元素的當前高度、寬度......   ——offsetheight、offsetwidth、offsettop;高度、寬度、上邊據等等

      2、瀏覽器尺寸改變觸發的事件：window.onresize

Java script基礎 回顧