javascript基礎(chǔ)知識集錦.docx

目錄Js基礎(chǔ)知識集錦（一）1Javascript文件上傳時檢測文件大小27js遍歷json數(shù)組28Js基礎(chǔ)知識集錦（一）主要知識點：js數(shù)組，數(shù)字函數(shù)，字符串函數(shù)，表單驗證，hashMap，堆棧，日期函數(shù)，call函數(shù) 等。next：js正則表達(dá)式，閉包，apply，callee，事件相關(guān)函數(shù)，Cookie等 1.javascript的數(shù)組APIJs代碼 1. /定義數(shù)組 2. varpageIds=newArray(); 3. pageIds.push(A); 4. 5. 數(shù)組長度 6. pageIds.length; 7. 8. /shift：刪除原數(shù)組第一項，并返回刪除元素的值；如果數(shù)組為空則返回undefined 9. vara=1,2,3,4,5; 10. varb=a.shift();/a：2,3,4,5b：1 11. 12. /unshift：將參數(shù)添加到原數(shù)組開頭，并返回數(shù)組的長度 13. vara=1,2,3,4,5; 14. varb=a.unshift(-2,-1);/a：-2,-1,1,2,3,4,5b：7 15. /注：在IE6.0下測試返回值總為undefined，F(xiàn)F2.0下測試返回值為7，所以這個方法的返回值不可靠，需要用返回值時可用splice代替本方法來使用。 16. 17. /pop：刪除原數(shù)組最后一項，并返回刪除元素的值；如果數(shù)組為空則返回undefined 18. vara=1,2,3,4,5; 19. varb=a.pop();/a：1,2,3,4b：5 20. 21. /push：將參數(shù)添加到原數(shù)組末尾，并返回數(shù)組的長度 22. vara=1,2,3,4,5; 23. varb=a.push(6,7);/a：1,2,3,4,5,6,7b：7 24. 25. /concat：返回一個新數(shù)組，是將參數(shù)添加到原數(shù)組中構(gòu)成的 26. vara=1,2,3,4,5; 27. varb=a.concat(6,7);/a：1,2,3,4,5b：1,2,3,4,5,6,7 28. 29. /splice(start,deleteCount,val1,val2,)：從start位置開始刪除deleteCount項，并從該位置起插入val1,val2, 30. vara=1,2,3,4,5; 31. varb=a.splice(2,2,7,8,9);/a：1,2,7,8,9,5b：3,4 32. varb=a.splice(0,1);/同shift 33. a.splice(0,0,-2,-1);varb=a.length;/同unshift 34. varb=a.splice(a.length-1,1);/同pop 35. a.splice(a.length,0,6,7);varb=a.length;/同push 36. 37. /reverse：將數(shù)組反序 38. vara=1,2,3,4,5; 39. varb=a.reverse();/a：5,4,3,2,1b：5,4,3,2,1 40. 41. /sort(orderfunction)：按指定的參數(shù)對數(shù)組進行排序 42. vara=1,2,3,4,5; 43. varb=a.sort();/a：1,2,3,4,5b：1,2,3,4,5 44. 45. /slice(start,end)：返回從原數(shù)組中指定開始下標(biāo)到結(jié)束下標(biāo)之間的項組成的新數(shù)組 46. vara=1,2,3,4,5; 47. varb=a.slice(2,5);/a：1,2,3,4,5b：3,4,5 48. 49. /join(separator)：將數(shù)組的元素組起一個字符串，以separator為分隔符，省略的話則用默認(rèn)用逗號為分隔符 50. vara=1,2,3,4,5; 51. varb=a.join(|);/a：1,2,3,4,5b：1|2|3|4|5/定義數(shù)組 var pageIds = new Array(); pageIds.push(A); 數(shù)組長度 pageIds.length;/shift：刪除原數(shù)組第一項，并返回刪除元素的值；如果數(shù)組為空則返回undefined var a = 1,2,3,4,5; var b = a.shift(); /a：2,3,4,5 b：1 /unshift：將參數(shù)添加到原數(shù)組開頭，并返回數(shù)組的長度 var a = 1,2,3,4,5; var b = a.unshift(-2,-1); /a：-2,-1,1,2,3,4,5 b：7 /注：在IE6.0下測試返回值總為undefined，F(xiàn)F2.0下測試返回值為7，所以這個方法的返回值不可靠，需要用返回值時可用splice代替本方法來使用。 /pop：刪除原數(shù)組最后一項，并返回刪除元素的值；如果數(shù)組為空則返回undefined var a = 1,2,3,4,5; var b = a.pop(); /a：1,2,3,4 b：5 /push：將參數(shù)添加到原數(shù)組末尾，并返回數(shù)組的長度 var a = 1,2,3,4,5; var b = a.push(6,7); /a：1,2,3,4,5,6,7 b：7 /concat：返回一個新數(shù)組，是將參數(shù)添加到原數(shù)組中構(gòu)成的 var a = 1,2,3,4,5; var b = a.concat(6,7); /a：1,2,3,4,5 b：1,2,3,4,5,6,7 /splice(start,deleteCount,val1,val2,)：從start位置開始刪除deleteCount項，并從該位置起插入val1,val2, var a = 1,2,3,4,5; var b = a.splice(2,2,7,8,9); /a：1,2,7,8,9,5 b：3,4 var b = a.splice(0,1); /同shift a.splice(0,0,-2,-1); var b = a.length; /同unshift var b = a.splice(a.length-1,1); /同pop a.splice(a.length,0,6,7); var b = a.length; /同push /reverse：將數(shù)組反序 var a = 1,2,3,4,5; var b = a.reverse(); /a：5,4,3,2,1 b：5,4,3,2,1 /sort(orderfunction)：按指定的參數(shù)對數(shù)組進行排序 var a = 1,2,3,4,5; var b = a.sort(); /a：1,2,3,4,5 b：1,2,3,4,5 /slice(start,end)：返回從原數(shù)組中指定開始下標(biāo)到結(jié)束下標(biāo)之間的項組成的新數(shù)組 var a = 1,2,3,4,5; var b = a.slice(2,5); /a：1,2,3,4,5 b：3,4,5 /join(separator)：將數(shù)組的元素組起一個字符串，以separator為分隔符，省略的話則用默認(rèn)用逗號為分隔符 var a = 1,2,3,4,5; var b = a.join(|); /a：1,2,3,4,5 b：1|2|3|4|5 2.dom最常用APIJs代碼 1. document方法： 2. getElementById(id)Node返回指定結(jié)點的引用 3. getElementsByTagName(name)NodeList返回文檔中所有匹配的元素的集合 4. createElement(name)NodeNode 5. createTextNode(text)Node創(chuàng)建一個純文本結(jié)點 6. ownerDocumentDocument指向這個節(jié)點所屬的文檔 7. documentElementNode返回html節(jié)點 8. document.bodyNode返回body節(jié)點 9. 10. element方法： 11. getAttribute(attributeName)String返回指定屬性的值 12. setAttribute(attributeName,value)String給屬性賦值 13. removeAttribute(attributeName)String移除指定屬性和它的值 14. getElementsByTagName(name)NodeList返回結(jié)點內(nèi)所有匹配的元素的集合 15. 16. node方法： 17. appendChild(child)Node給指定結(jié)點添加一個新的子結(jié)點 18. removeChild(child)Node移除指定結(jié)點的子結(jié)點 19. replaceChild(newChild,oldChild)Node替換指定結(jié)點的子結(jié)點 20. insertBefore(newChild,refChild)Node在同一層級的結(jié)點前面插入新結(jié)點 21. hasChildNodes()Boolean如果結(jié)點有子結(jié)點則返回true 22. 23. node屬性： 24. nodeNameString以字符串的格式存放結(jié)點的名稱 25. nodeTypeString以整型數(shù)據(jù)格式存放結(jié)點的類型 26. nodeValueString以可用的格式存放結(jié)點的值 27. parentNodeNode指向結(jié)點的父結(jié)點的引用 28. childNodesNodeList指向子結(jié)點的引用的集合 29. firstChildNode指向子結(jié)點結(jié)合中的第一個子結(jié)點的引用 30. lastChildNode指向子結(jié)點結(jié)合中的最后一個子結(jié)點的引用 31. previousSiblingNode指向前一個兄弟節(jié)點；如果這個節(jié)點就是兄弟節(jié)點，那么該值為null 32. nextSiblingNode指向后一個兄弟節(jié)點；如果這個節(jié)點就是兄弟節(jié)點，那么該值為nulldocument方法： getElementById(id) Node 返回指定結(jié)點的引用 getElementsByTagName(name) NodeList 返回文檔中所有匹配的元素的集合 createElement(name) Node Node createTextNode(text) Node 創(chuàng)建一個純文本結(jié)點 ownerDocument Document 指向這個節(jié)點所屬的文檔 documentElement Node 返回html節(jié)點 document.body Node 返回body節(jié)點 element方法： getAttribute(attributeName) String 返回指定屬性的值 setAttribute(attributeName,value) String 給屬性賦值 removeAttribute(attributeName) String 移除指定屬性和它的值 getElementsByTagName(name) NodeList 返回結(jié)點內(nèi)所有匹配的元素的集合 node方法： appendChild(child) Node 給指定結(jié)點添加一個新的子結(jié)點 removeChild(child) Node 移除指定結(jié)點的子結(jié)點 replaceChild(newChild,oldChild) Node 替換指定結(jié)點的子結(jié)點 insertBefore(newChild,refChild) Node 在同一層級的結(jié)點前面插入新結(jié)點 hasChildNodes() Boolean 如果結(jié)點有子結(jié)點則返回true node屬性： nodeName String 以字符串的格式存放結(jié)點的名稱 nodeType String 以整型數(shù)據(jù)格式存放結(jié)點的類型 nodeValue String 以可用的格式存放結(jié)點的值 parentNode Node 指向結(jié)點的父結(jié)點的引用 childNodes NodeList 指向子結(jié)點的引用的集合 firstChild Node 指向子結(jié)點結(jié)合中的第一個子結(jié)點的引用 lastChild Node 指向子結(jié)點結(jié)合中的最后一個子結(jié)點的引用 previousSibling Node 指向前一個兄弟節(jié)點；如果這個節(jié)點就是兄弟節(jié)點，那么該值為null nextSibling Node 指向后一個兄弟節(jié)點；如果這個節(jié)點就是兄弟節(jié)點，那么該值為null 3.網(wǎng)上搜藏的一個map對象:Js代碼 1. functionHashMap() 2. 3. /*Map大小*/ 4. varsize=0; 5. /*對象*/ 6. varentry=newObject(); 7. 8. /*存*/ 9. this.put=function(key,value) 10. 11. if(!this.containsKey(key) 12. 13. size+; 14. 15. entrykey=value; 16. 17. 18. /*取*/ 19. this.get=function(key) 20. 21. returnthis.containsKey(key)?entrykey:null; 22. 23. 24. /*刪除*/ 25. this.remove=function(key) 26. 27. if(this.containsKey(key)&(deleteentrykey) 28. 29. size-; 30. 31. 32. 33. /*是否包含Key*/ 34. this.containsKey=function(key) 35. 36. return(keyinentry); 37. 38. 39. /*是否包含Value*/ 40. this.containsValue=function(value) 41. 42. for(varpropinentry) 43. 44. if(entryprop=value) 45. 46. returntrue; 47. 48. 49. returnfalse; 50. 51. 52. /*所有Value*/ 53. this.values=function() 54. 55. varvalues=newArray(); 56. for(varpropinentry) 57. 58. values.push(entryprop); 59. 60. returnvalues; 61. 62. 63. /*所有Key*/ 64. this.keys=function() 65. 66. varkeys=newArray(); 67. for(varpropinentry) 68. 69. keys.push(prop); 70. 71. returnkeys; 72. 73. 74. /*MapSize*/ 75. this.size=function() 76. 77. returnsize; 78. 79. 80. /*清空*/ 81. this.clear=function() 82. 83. size=0; 84. entry=newObject(); 85. 86. 87. 88. varmap=newHashMap(); 89. 90. /* 91. map.put(A,1); 92. map.put(B,2); 93. map.put(A,5); 94. map.put(C,3); 95. map.put(A,4); 96. */ 97. /* 98. alert(map.containsKey(XX); 99. alert(map.size(); 100. alert(map.get(A); 101. alert(map.get(XX); 102. map.remove(A); 103. alert(map.size(); 104. alert(map.get(A); 105. */ 106. 107. /*同時也可以把對象作為Key*/ 108. /* 109. vararrayKey=newArray(1,2,3,4); 110. vararrayValue=newArray(A,B,C,D); 111. map.put(arrayKey,arrayValue); 112. varvalue=map.get(arrayKey); 113. for(vari=0;ivalue.length;i+) 114. 115. /alert(valuei); 116. 117. */ 118. /*把對象做為Key時，自動調(diào)用了該對象的toString()方法其實最終還是以String對象為Key*/ 119. 120. /*如果是自定義對象那自己得重寫toString()方法否則.就是下面的結(jié)果*/ 121. 122. functionMyObject(name) 123. 124. =name; 125. 126. 127. /* 128. functionMyObject(name) 129. 130. =name; 131. 132. this.toString=function() 133. 134. ; 135. 136. 137. */ 138. varobject1=newMyObject(小張); 139. varobject2=newMyObject(小名); 140. 141. map.put(object1,小張); 142. map.put(object2,小名); 143. alert(map.get(object1); 144. alert(map.get(object2); 145. map.remove(xxxxx); 146. alert(map.size(); 147. 148. /*運行結(jié)果小名小名size=1*/ 149. 150. /*如果改成復(fù)寫toString()方法的對象,效果就完全不一樣了*/ 151. 152. function HashMap() /* Map 大小 */ var size = 0; /* 對象 */ var entry = new Object(); /* 存 */ this.put = function (key , value) if(!this.containsKey(key) size + ; entrykey = value; /* 取 */ this.get = function (key) return this.containsKey(key) ? entrykey : null; /* 刪除 */ this.remove = function ( key ) if( this.containsKey(key) & ( delete entrykey ) ) size -; /* 是否包含 Key */ this.containsKey = function ( key ) return (key in entry); /* 是否包含 Value */ this.containsValue = function ( value ) for(var prop in entry) if(entryprop = value) return true; return false; /* 所有 Value */ this.values = function () var values = new Array(); for(var prop in entry) values.push(entryprop); return values; /* 所有 Key */ this.keys = function () var keys = new Array(); for(var prop in entry) keys.push(prop); return keys; /* Map Size */ this.size = function () return size; /* 清空 */ this.clear = function () size = 0; entry = new Object(); var map = new HashMap(); /* map.put(A,1); map.put(B,2); map.put(A,5); map.put(C,3); map.put(A,4); */ /* alert(map.containsKey(XX); alert(map.size(); alert(map.get(A); alert(map.get(XX); map.remove(A); alert(map.size(); alert(map.get(A); */ /* 同時也可以把對象作為 Key */ /* var arrayKey = new Array(1,2,3,4); var arrayValue = new Array(A,B,C,D); map.put(arrayKey,arrayValue); var value = map.get(arrayKey); for(var i = 0 ; i value.length ; i+) /alert(valuei); */ /* 把對象做為Key時 ，自動調(diào)用了該對象的 toString() 方法 其實最終還是以String對象為Key*/ /* 如果是自定義對象 那自己得重寫 toString() 方法 否則 . 就是下面的結(jié)果 */ function MyObject(name) = name; /* function MyObject(name) = name; this.toString = function () return ; */ var object1 = new MyObject(小張); var object2 = new MyObject(小名); map.put(object1,小張); map.put(object2,小名); alert(map.get(object1); alert(map.get(object2); map.remove(xxxxx); alert(map.size(); /* 運行結(jié)果 小名 小名 size = 1 */ /* 如果改成復(fù)寫toString()方法的對象 , 效果就完全不一樣了 */ 4.常用的數(shù)字函數(shù):Js代碼 1. 數(shù)字型(Number) 2. 1.聲明 3. vari=1; 4. vari=newNumber(1); 5. 6. 2.字符串與數(shù)字間的轉(zhuǎn)換 7. vari=1; 8. varstr=i.toString();/結(jié)果:1 9. varstr=newString(i);/結(jié)果:1 10. i=parseInt(str);/結(jié)果:1 11. i=parseFloat(str);/結(jié)果:1.0 12. 13. /注意:parseInt,parseFloat會把一個類似于32G的字符串,強制轉(zhuǎn)換成32 14. 15. 3.判斷是否為有效的數(shù)字 16. vari=123;varstr=string; 17. if(typeofi=number)/true 18. 19. /某些方法(如:parseInt,parseFloat)會返回一個特殊的值NaN(NotaNumber) 20. /請注意第2點中的注意,此方法不完全適合判斷一個字符串是否是數(shù)字型! 21. i=parseInt(str); 22. if(isNaN(i) 23. 24. 4.數(shù)字型比較 25. /此知識與字符串比較相同 26. 27. 5.小數(shù)轉(zhuǎn)整數(shù) 28. varf=1.5; 29. vari=Math.round(f);/結(jié)果:2(四舍五入) 30. vari=Math.ceil(f);/結(jié)果:2(返回大于f的最小整數(shù)) 31. vari=Math.floor(f);/結(jié)果:1(返回小于f的最大整數(shù)) 32. 33. 6.格式化顯示數(shù)字 34. vari=3.14159; 35. 36. /格式化為兩位小數(shù)的浮點數(shù) 37. varstr=i.toFixed(2);/結(jié)果:3.14 38. 39. /格式化為五位數(shù)字的浮點數(shù)(從左到右五位數(shù)字,不夠補零) 40. varstr=i.toPrecision(5);/結(jié)果:3.1415 41. 42. 7.X進制數(shù)字的轉(zhuǎn)換 43. /不是很懂-.- 44. vari=parseInt(0x1f,16); 45. vari=parseInt(i,10); 46. vari=parseInt(11010011,2); 47. 48. 8.隨機數(shù) 49. /返回0-1之間的任意小數(shù) 50. varrnd=Math.random(); 51. /返回0-n之間的任意整數(shù)(不包括n) 52. varrnd=Math.floor(Math.random()*n)數(shù)字型(Number) 1.聲明 var i = 1; var i = new Number(1); 2.字符串與數(shù)字間的轉(zhuǎn)換 var i = 1; var str = i.toString(); /結(jié)果: 1 var str = new String(i); /結(jié)果: 1 i = parseInt(str); /結(jié)果: 1 i = parseFloat(str); /結(jié)果: 1.0 /注意: parseInt,parseFloat會把一個類似于32G的字符串,強制轉(zhuǎn)換成32 3.判斷是否為有效的數(shù)字 var i = 123; var str = string; if( typeof i = number ) /true /某些方法(如:parseInt,parseFloat)會返回一個特殊的值NaN(Not a Number) /請注意第2點中的注意,此方法不完全適合判斷一個字符串是否是數(shù)字型! i = parseInt(str); if( isNaN(i) ) 4.數(shù)字型比較 /此知識與字符串比較相同 5.小數(shù)轉(zhuǎn)整數(shù) var f = 1.5; var i = Math.round(f); /結(jié)果:2 (四舍五入) var i = Math.ceil(f); /結(jié)果:2 (返回大于f的最小整數(shù)) var i = Math.floor(f); /結(jié)果:1 (返回小于f的最大整數(shù)) 6.格式化顯示數(shù)字 var i = 3.14159; /格式化為兩位小數(shù)的浮點數(shù) var str = i.toFixed(2); /結(jié)果: 3.14 /格式化為五位數(shù)字的浮點數(shù)(從左到右五位數(shù)字,不夠補零) var str = i.toPrecision(5); /結(jié)果: 3.1415 7.X進制數(shù)字的轉(zhuǎn)換 /不是很懂 -.- var i = parseInt(0x1f,16); var i = parseInt(i,10); var i = parseInt(11010011,2); 8.隨機數(shù) /返回0-1之間的任意小數(shù) var rnd = Math.random(); /返回0-n之間的任意整數(shù)(不包括n) var rnd = Math.floor(Math.random() * n) 5.網(wǎng)上搜藏的js堆棧:Js代碼 1. functionstack() 2. if(this.top=undefined) 3. /初始化堆棧的頂部指針和數(shù)據(jù)存放域 4. this.top=0; 5. this.unit=newArray(); 6. 7. this.push=function(pushvalue) 8. /定義壓入堆棧的方法 9. this.unitthis.top=pushvalue; 10. this.top+=1; 11. 12. this.readAllElements=function() 13. /定義讀取所有數(shù)據(jù)的方法 14. if(this.top=0) 15. alert(當(dāng)前?？?，無法讀取數(shù)據(jù)); 16. return(); 17. 18. varcount=0; 19. varoutStr=; 20. 21. for(count=0;co