首頁 > 後端開發 > php教程 > Javascript總結

Javascript總結

jacklove
發布: 2023-03-31 17:12:01
原創
1175 人瀏覽過

本文章有許多知識與圖片引用它處,如果有所涉及請諒解,本文章只用於個人學習。

Arguments(類別數組物件)

#主要儲存給函數傳入的參數




ele.style.border這種方式在js中只能取得行內樣式,所以引用currentStyle和getComputedStyle,但它們不能更改屬性,只能取得屬性,且有相容性。

currentStyle(相容IE)

getComputedStyle(相容火狐,Google)

寫法ele .currentStyle[“attr”]或ele.currentStyle.attr

window.getComputedStyle(ele,null)[attr]或window.getComputedStyle(ele,null).attr  

onfocus(獲得焦點)onblur(失去焦點)

onfocus在元素獲得焦點時觸發

#onblur在元素失去焦點時觸發

shift()刪除數組第一項           aTmp.shift()

unshift()新增陣列第一項        aTmp.unshift(「Java」)

pop()刪除陣列最後一項         aTmp.pop()#pop.

push()新增陣列最後一項        aTmp.push(「Java」)

concat()連接多個陣列        

##join將陣列中所有元素合成一個字串


#splice()從陣列中新增/刪除元素,再新增上元素

arr.splice(2,1,”Javs”)刪除陣列中從第2項開始(包括第2項)的1項,再在原位置上新增Java

arr.splice(2,3,”Java”)刪除陣列中從第2項開始的3項,再在原位置上新增Java

addHandler()為物件新增事件函數,有三個參數。

範例: EventUtil.addHandler( elem , event , function() );      對象,事件,函數

removeHandler()為物件移出目前新增的事件,有三個函數。

範例: EventUtil.removeHandler( elem , event , function());   對象,事件,函數

  addEventListener()用於新增事件,有三個參數

例如: elem.addEventListener( event , function() , use);   事件,函數,執行順序(冒泡[false]或捕獲[true])

#removeEventListener()用於給指定元素刪除事件,有三個參數

例如: elem .removeEventListener( event , function() , use)   事件,函數,執行順序;

 attachEvent()為物件新增事件,兩個函數

範例: elem.attachEvent( “on” event , function() );      事件,且函數

detachEvent()刪除指定事件,兩個參數,必須是attachEvent()新增的事件才能被detachEvent()刪除

範例: elem.detachEvent( “on” event , function() );     事件,函數

#attachEvent與detachEvent處理事件前面需要加on

#removeEventListener在HTML元素上移出綁定事件,addEventListener在HTML元素上綁定事件。

FF,chrome,opera,safar,IE9支援

 detachEvent在HTML元素上移出綁定事件, attachEvent在HTML元素上綁定事件

只有IE支援

所以為了適應跨瀏覽器將兩個都寫上,在根據具體的瀏覽器判斷,使用哪一種

範例:elem.addEventListener ? elem.addEventLIistener(sEvent , fnHandler , false ) : elem.attachEvent( “on” sEvent , fnHandler )

判斷是否存在addEventListener如果存在用addEventListener,如果不存在用attachEvent。

match()函數

#

檢索並傳回檢索到的字符,物件可以是字串,可以是正規表示式

例1:var str = “Hello world!”

     document.write(str.match(“world”) “
”)    //world

範例2:var str = “1 plus 2 equal3”

     Document.write(str.match(/\d /g))           #  #keycode()事件

傳回鍵盤敲的鍵的ASCII值

一般與onkeyup和onkeydown一起使用

範例var x = event.keyCode;

 onkeydown()事件

在鍵盤上按下一個鍵就會觸發事件

範例:;

onkeypress()事件

在鍵盤按下一個鍵並釋放之後就會觸發

 onkeyup()事件

在鍵盤按鍵被放開之後會觸發

 三個事件的順序為onkeydown,onkeypress,onkeyup

 #滑鼠點選事件

onclick,onmousedown, onmouseup,oncontextmenu,ondblclick

 #onclick

##當滑鼠點擊元素時,觸發事件

onmousedown

當滑鼠按鍵被按下時,觸發事件

 

onmouseup

當滑鼠按鍵按下然後放開時,觸發事件

 

oncontextmenu

當使用者在元素上右鍵時,觸發事件

 

ondblclick

當滑鼠雙擊元素時,觸發事件 

client 視覺區域

   offsetWidth: width padding border

   clientWidth: width padding 不包含border

   scrollWidth: 大小是內容大小

ctrlKey()

#回傳一個布林值,指示當事件發生時,Ctrl鍵是否被按下 

setCapture()

把滑鼠事件擷取到目前文件指定的物件,但只能擷取滑鼠事件(onmousedown,onmouseup,onmousemove,onclick,ondbclick,onmouseover,onmouseout)而不能捕獲鍵盤事件。

releaseCapture()

與setCapture()對應,釋放滑鼠事件,setCapture()與releaseCapture()是IE的專用方法。

obj.style.left與obj.offsetLeft都是相對於父元素的值,此外,obj.style.left回傳的是字串即例28px是可讀寫的(即可修改的),obj,offsetLeft回傳的是數值例28只可讀取(不能修改),obj.style.top與obj.offsetTop也是。

 

appendChild( newChild )

一個參數,在父節點的內部的尾部追加一個新的節點

範例:target.appendChild( newChild )

insertBefore()

範例:target. insertBefore( newChild , targetChild )

兩個參數,將新節點插入目標節點的前面

##target被加入節點和現有節點的父節點。

newChild將要插入的節點。

targetChild現有的節點,新節點將會插入它的前面,這個值可以是null。

insertAfter()

target.insertAfter( newChild , targetChild )

#沒有提供這種方法,需要自己寫一個函數使用

兩個參數,第一個參數與insertBefore相同,第二個參數表示新節點將會插入它的後面

# ########函數為:############Function insertAfter( newElement , targetElement ){############    var parent = targetElement.parentNode; ############    if(parent.lastChild == targetElement){############         parent。 ###    }############    else{#####################    else{######################      parent.insertBefore(newElement,,targetElement.nextSibling);####

    }

}

##childNodes

#使用childNodes屬性可以傳回一個陣列中,陣列包含這個父節點中的所有子節點。  

firstChild

#firstChild是傳回目標元素節點的子節點的第一個,相當於childNodes[0 ]。  

lastChild#lastChild是回傳目標元素節點的子節點的最後一個,相當於childNodes[length- 1]。

 

範例:target.childNodes[1]   取得目標節點下的第二個節點## 

nextSibling

傳回某個元素同一層級之後緊接在後的節點

 

previousSibling

傳回某個元素同一層級之前的一個節點

 

範例:document.getElementById(“item”).nextSibling

 

offsetParent 指與位置有關的上級元素只讀

parentNode 指與位置無關的上級元素只讀

 

Math.ceil()對一個數值進行向上取整

##傳回大於或等於的整數

 Math.floor()對數值進行向下取整

傳回小於或等於的整數

 

Math.round()四捨五入傳回一個與數值最接近的值

#範例:Math.ceil(x);

 

a||b

##   如果a是true,那麼不管b是true還是false,都回傳true,因此不用判斷b(即不用再執行b)了,這個時候剛好判斷到a,因此回傳a。

   如果a是false,那麼就要判斷b(執行b),如果b是true,回傳true,如果是false,則回傳false,其實就是回傳b。

a&&b

   如果a是false,那麼b不管是true還是false,都回傳false,因此不用判斷b(即不用執行b)了,這個時候剛好判斷到a,回a。

   如果a是true,那就要判斷b,那麼不管b是true還是false,都回傳b。

  這個便可以用來判斷選擇執行

範例:maxWidth < getOffset.left(oUl[0 ]) &&(oUl[0].style.left = -oUl[0].clientWidth “px”);

 

即若maxWidth大於或等於oUl [0]的距父元素左端值,那麼前面為false,則不用執行後面

#  如果maxWidth小於oUl[0]的左端值,那麼前面為true,要執行後面則oUl[0]的距父元素左端值為負。

 

數值轉換

兩個參數,第一個為要轉換的數值(可以為布林值,可以為不同進位的值),第二個為要轉換的進位(可以省略,預設為轉換為十進位)。轉換時,從第一個字符開始,掠過空格直到找到第一個非空格字符,如果字符是字母則返回NaN,如果為數字則開始轉換。小數忽略小數點之後轉換為整數,如果數字後面有字母,則轉換到字母前後面省略。其他按需要的進位轉換。 範例:var num1 = parseInt(“0xF”)      //15

 

Number()

只有一個參數,為需要轉換的數值,基本轉換基本上與parseInt()一致,如從第一個字元開始,會忽略空格和字符,而且只能轉換為十進制的整數或小數(小數點後13位),可以轉換布林值。 範例:var num1 = Number(“0011”)    //11

 

#parseFloat() 只有一個參數為需要轉換的數值,會辨識第一個小數,忽略第二個小數及其之後的東西,只能轉換為十進制,其他基本上與parseInt()一致。

 

return#用於傳回呼叫函數,所得的結果。

 

return;#表示到此結束,呼叫函數結束,執行權交給頁面。

 

return: false;

#傳回錯誤的處理結果以及阻止程式碼繼續執行。 一般是用來阻止預設動作的執行。

 

###return: true;#############傳回正確的處理結果。 ######

本文說明了Javascript一些總結,更多相關內容請關注php中文網。

相關推薦:

簡易PHP MySQL 分頁類別

兩個不用遞歸的樹狀陣列建構函式

#HTML轉Excel,並實作列印,下載功能

#

以上是Javascript總結的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板