JavaScript-基礎(chǔ)重點歸納_第1頁
JavaScript-基礎(chǔ)重點歸納_第2頁
JavaScript-基礎(chǔ)重點歸納_第3頁
JavaScript-基礎(chǔ)重點歸納_第4頁
JavaScript-基礎(chǔ)重點歸納_第5頁
已閱讀5頁,還剩12頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

目錄JavaScript重點歸納 3第一章JavaScript的基本語法 31、為什么要學(xué)習(xí)JS 32、什么是JavaScript 33、在網(wǎng)頁中引用JavaScript的方式 34、JavaScript核心語法 35、數(shù)據(jù)類型 46、常用的輸入/輸出 47、語法約定 48、Firebug工具,火狐插件調(diào)試工具。 4第2章函數(shù)和window對象 41、常用的系統(tǒng)函數(shù) 42、自定義函數(shù) 53、匿名函數(shù) 54、轉(zhuǎn)義符 55、變量的作用域 56、window對象 67、Date對象 6第3章BOM編程 71、history對象 72、location對象 73、document對象 74、元素的顯示和隱藏 7第4章DOM高級編程 81、DOM的組成 82、CoreDOM的標(biāo)準(zhǔn)節(jié)點操作 83、HTMLDOM的特有對象和操作 9第5章JavaScript和CSS的交互 101、JavaScript訪問樣式的常用方法 102、獲取樣式屬性值 103、獲取滾動條滾動的距離 11第6章表單基本驗證技術(shù) 111、基本數(shù)據(jù)類型String和對象String的區(qū)別 112、String對象的方法 123、表單提交的方法 124、文本框控件 125、制作文本輸入提示特效 13第7章正則表達(dá)式和表單輔助特效 131、正則表達(dá)式 132、定義正則表達(dá)式: 133、表達(dá)式的模式 134、RegExp(正則表達(dá)式)對象的常用方法 145、使用下拉列表框?qū)崿F(xiàn)級聯(lián)效果 156、Array數(shù)組對象 15擴(kuò)展 171、對象類型和基本類型 172、Math對象 173、number對象 17

JavaScript重點歸納第一章JavaScript的基本語法1、為什么要學(xué)習(xí)JS客戶端表單驗證頁面動態(tài)效果動態(tài)改變頁面內(nèi)容2、什么是JavaScriptJavaScript是一種描述語言,也是一種基于對象和事件驅(qū)動的、并具有安全性能的腳本語言。JavaScript的組成JavaScriptDOMJavaScriptDOM文檔對象模型BOM瀏覽器對象模型BOM瀏覽器對象模型ECMAScript核心語法3、在網(wǎng)頁中引用JavaScript的方式①使用<script>標(biāo)簽<scripttype=”text/javascript”>內(nèi)容</script>②使用外部JavaScript文件<scripttype=”text/javascript”src=”js文件路徑”></script>③直接在HTML標(biāo)簽中<inputname=”btn”type=”button”value=”彈出消息框”onclick=”javascript:alert(‘歡迎你’);”/>4、JavaScript核心語法聲明變量var變量名;注意:JavaScript區(qū)分大小寫,var可不要,但一般先聲明,再賦值使用5、數(shù)據(jù)類型JavaScript是一種弱類型語言,在聲明變量時不需要聲明變量的數(shù)據(jù)類型,面是由賦給變量的值決定,但有時也需要檢測變量的具體數(shù)據(jù)類型(通過typeof)。數(shù)據(jù)類型typeof()的返回結(jié)果示例undefined(未定義類型)undefinedvarwidth;null(空類型)objecttypeof(null)number(數(shù)值類型)numbervarheight=20;string(字符串類型)stringvarname=”rose”;boolean(布爾類型)booleanvarisOk=true;alert(null==undefined);返回trueundefined、null兩個值是相等的,但含義不同,undefined是聲明了變量但未對該變量賦值,null表示對該變量賦了一個空值。6、常用的輸入/輸出警告:alert(“提示信息”);提示輸入框:prompt(“提示信息”,”輸入框的默認(rèn)信息”);7、語法約定區(qū)分大小寫,JavaScript的關(guān)鍵字一般都是小寫,內(nèi)置對象是以大寫字母開頭的(Date、Math),Dom對象的名稱通常是小寫字母開頭,遵循駱駝命名法。變量、對象和函數(shù)的名稱:可以包括大寫字母、小寫字母、數(shù)字、下劃線和$符號,但不能以數(shù)字開頭。分號結(jié)尾:推薦使用;號作業(yè)一行代碼的結(jié)尾。8、Firebug工具,火狐插件調(diào)試工具。第2章函數(shù)和window對象1、常用的系統(tǒng)函數(shù)parseInt(“字符串”):將一個有效的數(shù)字字符串轉(zhuǎn)換成整型數(shù)字parseFloat(“字符串”):將一個有效的數(shù)字字符串轉(zhuǎn)換成浮點型數(shù)字isNaN():isnotanumber檢查參數(shù)是否是非數(shù)字參數(shù)parseInt()parseFloatisNaN()“78.57”7878.57false“78.88color”7878.88true“this98.6”NaNNaNtrue“56.45.56”5656.45true87+'.5'8787.5false2、自定義函數(shù)function函數(shù)名([參數(shù)1,參數(shù)2,參數(shù)3,...]){ JavaScript語句; [return返回值;]}調(diào)用函數(shù):事件名=”函數(shù)名()”注意事項:實參比形參少的情況,默認(rèn)賦值undefined;實參比形參多時,自動舍棄。所有函數(shù)都有返回值,沒寫return的情況下返回undefined。在HTML中只有事件才可以直接調(diào)用js中的函數(shù),事件一般以on開頭,其它屬性要調(diào)用則要加前綴javascript:如href=”javascript:函數(shù)名();”3、匿名函數(shù)[var變量名|事件名]=function(){...}匿名函數(shù)只能定義在前,使用在后4、轉(zhuǎn)義符\n換行、\t\r換行、\’\”\\轉(zhuǎn)義符只能在alert()中使用,在document.write()不能使用。5、變量的作用域局部變量和全局變量和java中類似。在函數(shù)內(nèi)部如果沒有用var來聲明變量那么這個變量變是一個全局變量。6、window對象常用方法名稱說明prompt顯示可提示用戶輸入的圣誕框alert顯示一個帶有提示信息和一個“確定”按鈕的警示框confirm顯示一個帶有提示信息和一個“確定”和“取消”按鈕的警示框close關(guān)閉瀏覽器窗口open打開一個新的瀏覽器窗口,可以設(shè)置諸多屬性setTimeout(函數(shù),間隔毫秒數(shù))在指定毫秒數(shù)后調(diào)用函數(shù)或計算表達(dá)式(調(diào)用一次),clearTimeout(名稱)可以清除定時器setInterval(函數(shù),間隔毫秒數(shù))按照指定的周期來調(diào)用函數(shù)或表達(dá)式(調(diào)用多次)clearInterval()清除定時器常用事件名稱說明onload一個頁面或一幅圖像完成加載onmouseover鼠標(biāo)移動到某元素上onclick鼠標(biāo)單擊某個對象onkeydown某個鍵盤按鍵被按下onchange域的內(nèi)容被改變7、Date對象用于操作日期和時間var日期實例=newDate([參數(shù)]);方法:getXxx()獲取時間和日期值,如getDate()獲取一月中的每一天getHours(),getminutes(),getMonth(),getFullYear(),getDay()獲取星期中的某一天。getMonth()返回0~11之間的值,實際月份=getMonth()+1setXxx()設(shè)置時間和日期值Date對象直接得到年-月-日時-分-秒格式的方法vard=newDate();vars=d.toLocaleString();第3章BOM編程1、history對象提供用戶最近瀏覽過的URL列表對象的方法:back()返回、forward()前進(jìn)、go(n)前進(jìn)或后退n個頁面。2、location對象方法:reload()重新加載當(dāng)前文檔、replace()用新的文檔替換當(dāng)前文檔3、document對象常用方法名稱說明getElementById()返回對擁有指定id的第一個對象的引用getElementByName()返回帶有指定名稱的對象的集合(數(shù)組)getElementByTagName()返回帶有指定標(biāo)簽名的對象的集合(數(shù)組)write()向文檔寫文本,HTML表達(dá)式或JavaScript代碼對象數(shù)組.length可以獲取數(shù)組的長度對象名.getElementByTagName():返回該對象的子節(jié)點中指定名稱的對象的集合document對象經(jīng)常應(yīng)用于實現(xiàn)網(wǎng)頁元素的顯示和隱藏效果。4、元素的顯示和隱藏object.style.visibility=“值” visible為可見,hidden不可見object.style.display=“值” none不顯示,block顯示為塊級元素兩者區(qū)別:使用visibility屬性設(shè)置元素不可見,此元素會占據(jù)頁面上的空間。使用display屬性設(shè)置元素不顯示,此元素不會占據(jù)頁面空間。

第4章DOM高級編程1、DOM的組成CoreDOM:也稱核心DOM編程,定義了一套標(biāo)準(zhǔn)的針對任何結(jié)構(gòu)化文檔的對象,包括HTML,XHTML,XML。XMLDOM:定義了一套標(biāo)準(zhǔn)的針對XML文檔的對象。HTMLDOM:定義了一套標(biāo)準(zhǔn)的針對HTML文檔的對象。2、CoreDOM的標(biāo)準(zhǔn)節(jié)點操作訪問和修改節(jié)點屬性object.getAttribute(“屬性名”):獲取對象的屬性值。object.setAttribute(“屬性名”,”屬性值”):設(shè)置對象屬性值經(jīng)驗:使用getAttribute()方法以讀取屬性值時,如果屬性不存在,返回null根據(jù)層次關(guān)系查找節(jié)點(適合于在文檔局部短距離查找元素)object.屬性childNodes[index]:按下標(biāo)訪問指定子節(jié)點childNodes:子節(jié)點集合(數(shù)組)firstChild:第一個子節(jié)點nextSbling:下一個子節(jié)點lastChild:最后一個子節(jié)點parentNode:父節(jié)點注意事項:對表格進(jìn)行查找時,表格默認(rèn)會有<tbody>、<thead>和<tfoot>,查找時要考慮它們的存在。訪問文檔的根節(jié)點的方法:document.documentElement //IE和火狐document.body //谷歌創(chuàng)建和增加節(jié)點名稱描述document.createElement(“tagName”)按照給定的標(biāo)簽名稱創(chuàng)建一個新的元素節(jié)點父節(jié)點.appendChild(nodeName)向已存在節(jié)點列表的末尾添加新的子節(jié)點父節(jié)點.insertBefore(newNode[,oldNode])向指定的節(jié)點之前插入一個新的子節(jié)點要克隆的對象.cloneNode(true|false)復(fù)制某個指定的節(jié)點cloneNode()的參數(shù)值為true表示復(fù)制指定的節(jié)點及它的所有子節(jié)點,為false只復(fù)制該節(jié)點和屬性。刪除和替換節(jié)點名稱描述父節(jié)點.removeChild(node)刪除指定的節(jié)點父節(jié)點.replaceChild(newNode,oldNode)用其他的節(jié)點替換指定的節(jié)點3、HTMLDOM的特有對象和操作訪問HTMLDOM對象的屬性:對象名.屬性名表格對象屬性和方法Table對象類別名稱描述屬性rows[]返回包含表格中所有行的一個數(shù)組方法insertRow(index)在表格中的index所在行之前插入一個新行deleteRow(index)從表格中刪除一行TableRow對象類別名稱描述屬性cells[]返回包含行中所有單元格的一個數(shù)組rowIndex獲取對象在表格的rows集合中的位置。sectionRowIndex獲取對象位于tBody,tHead,tFoot或rows集合中的位置。方法insertCell()在一行中的指定位置插入一個空的<td>標(biāo)簽deleteCell()刪除行中指定的單元格TableCell對象類別名稱描述屬性cellIndex返回單元格在某行單元格集合中的位置innerHTML設(shè)置或返回單元格的開始標(biāo)簽和結(jié)束標(biāo)簽之間的HTMLinnerText設(shè)置或返回單元格的開始標(biāo)簽和結(jié)束標(biāo)簽之間的文本內(nèi)容align設(shè)置或返回單元水平排列方式className設(shè)置或返回元素的class屬性注意:數(shù)組下標(biāo)和行、單元格的位置都是從0開始,

第5章JavaScript和CSS的交互1、JavaScript訪問樣式的常用方法style屬性(對象)HTML元素.style.樣式屬性=”值”;注意事項:在JS中的CSS樣式一在HTML中使用不同,由多個單詞組成的樣式屬性要去到中間的”-”號,第一個單詞首字小寫,其余首字母大寫,如backgroundColor。var變量=HTML元素.style.樣式屬性;該方式只能獲取內(nèi)聯(lián)樣式的屬性值,無法獲取內(nèi)部樣式表或外部樣式表中的屬性值。元素的常用事件名稱描述onclick當(dāng)用戶單擊某個對象時調(diào)用事件onmouseover鼠標(biāo)移到某元素上onmouseout鼠標(biāo)從某元素移開onmousedown鼠標(biāo)按鈕被按下this關(guān)鍵字:通常指向正在執(zhí)行的函數(shù)本身或指向函數(shù)所屬的對象或事件所屬的對象。如:鼠標(biāo)移到對象上時改變對象的背景圖片object.onmouseover=functioin(){this.style.backgroundImage=”url(images/bg2.jpg)”;}className屬性HTML元素.className=”CSS類選擇器樣式名稱”2、獲取樣式屬性值style對象中的Positioning(偏移)屬性top、left、right、bottom分別設(shè)置元素的頂、左、右、底邊緣距離父元素頂、左、右、底邊緣的距離,單位px。zIndex設(shè)置元素的堆疊次序。獲取內(nèi)部樣式表或外部樣式表中的屬性值的方法:IE:object.currentStyle.樣式屬性;(只讀)火狐/谷歌:document.defaultView.getComputedStyle(元素,null).屬性;3、獲取滾動條滾動的距離scrollTop和scrollLeft屬性名稱描述scrollTop設(shè)置或獲取位于對象最頂端和窗口中可見內(nèi)容的最頂端之間的距離,即對象在垂直方向上滾動的距離,單位pxscrollLeft設(shè)置或獲取位于對象左邊界和窗口中目前可見內(nèi)容的最左端之間的距離即對象在水平方向上滾動的距離,單位pxclientWidth指對象的可見寬度,即在樣式中設(shè)置的width值,不帶pxclientHeight指對象的可見高度,即在樣式中設(shè)置的height值,不帶px得到瀏覽器滾動條的垂直滾動距離的方法:document.ducumentElement.scrollTop; //IE和火狐document.body.scrollTop: //谷歌設(shè)置div內(nèi)容超過其大小時產(chǎn)生滾動條:overflow:scroll;頁面事件名稱描述onscroll用于捕捉頁面垂直和水平的滾動,水平和垂直滾動距離動態(tài)變化onload一個頁面或一幅圖片完成加載(上傳)第6章表單基本驗證技術(shù)1、基本數(shù)據(jù)類型String和對象String的區(qū)別對象類型Stringvarstr1=newString(“I’maprogrammer”);varlen1=str1.length;len可以得到字符串的長度基本類型Stringvarstr2=“I’maprogrammer”;varlen2=str2.length;len也可以得到字符串的長度解釋:當(dāng)我們聲明了一個基本類型的字符串,要把它當(dāng)作對象類型來使用時,如訪問其屬性或方法,JavaScript知道這些操作只適用于對象類型,會將字符串的字面值臨時轉(zhuǎn)換為對象類型,以適用當(dāng)前的操作,此操作對于number和boolean類型同樣適用。2、String對象的方法方法名作用Str1.charAt(index)選取字符串中某一位置的單個字符Str1.charCodeAt(index)返回該位置字符對應(yīng)的Unicode編碼Unicode編碼表a-z:97~122A-Z:65~900-9:48~57String.fromCharCode()將編碼轉(zhuǎn)成字符(可用于生成英文字母)Str1.indexOf(str2)查找str2在str1中第一出現(xiàn)的位置Str1.lastIndexOf(str2)查找str2在str1中最后一次出現(xiàn)的位置Str1.substr(starpos,[length])截取字符串Str1.substring(starpos,[endpos])截取字符串,含開始不含結(jié)束Str1.toLowerCase()轉(zhuǎn)小寫字母Str1.toUpperCase()轉(zhuǎn)大寫字母3、表單提交的方法onsubmit=”return表單驗證的函數(shù)”onsubmit方法根據(jù)函數(shù)返回值來決定是否提交表單,當(dāng)返回值是false時表單不提交,當(dāng)返回值為true時提交表單。4、文本框控件文本框?qū)ο蟪S玫姆椒ê蛯傩灶悇e名稱描述事件onblur失去焦點,當(dāng)光標(biāo)離開文本框時觸發(fā)onfocus獲得焦點,當(dāng)光標(biāo)進(jìn)行入文本框時觸發(fā)onkeypress某個鍵盤按鍵被按下并松開方法blur()從文本域中移開焦點focus()文本框獲得焦點select()選取文本框中的內(nèi)容,并突出顯示,常用于提示用戶輸入屬性id設(shè)置或返回文本框的idvalue設(shè)置或返回文本框的value屬性的值5、制作文本輸入提示特效鼠標(biāo)離開文本框時,驗證輸入是否合法,<inputid=”email”type=”text”class=”inputs”onblur=”checkEmal()”/><divclass=”red”id=”DivEmail”></div>通過object.innerHTMl改變div中的提示內(nèi)容和樣式。設(shè)置div的樣式display=inline;將塊級標(biāo)簽和等級標(biāo)簽置于同一行。獲得指定ID的對象的封裝函數(shù):function$(elementId){ returndocument.getElementById(elementId);}第7章正則表達(dá)式和表單輔助特效1、正則表達(dá)式正則表達(dá)式是一個描述字符模式的對象,它由一些特殊的符號組成的,其組成的字符模式用來匹配各種表達(dá)式。2、定義正則表達(dá)式:普通方式varreg=/表達(dá)式/附加參數(shù)表達(dá)式:一個字符串代表了某種規(guī)則附加參數(shù):用來擴(kuò)展表達(dá)式的含義,可以任意組合,代表復(fù)合含義g:代表可以進(jìn)行全局匹配 globali:代表不區(qū)分大小寫匹配 ignoreCasem:代表可以進(jìn)行多選匹配 multiline構(gòu)造函數(shù)varreg=newRegExp("表達(dá)式”,”附加參數(shù)”);經(jīng)驗:普通方式中的表達(dá)式必須是一個常量字符串,而構(gòu)造函數(shù)中的表達(dá)式可以是常量字符串,也可以是一個JavaScript變量。3、表達(dá)式的模式復(fù)合模式:指含有通配符來表達(dá)的模式varreg=/^通配符$/正則表達(dá)式的常用通配符符號描述/.../代表一個模式的開始和結(jié)束^匹配字符串的開始$匹配字符串的結(jié)束\s任何空白字符//space\S任何非空白字符\d匹配一個數(shù)字字符,等價于[0-9]//digit\D除了數(shù)字之外的任何字符,等價于[^0-9]//whatever\w匹配一個數(shù)字、下劃線或字母字符,等價于[A-Za-z0-9_]\W任何非單字字符,等價于[^A-Za-z0-9_].除了換行符之外的任意字符正則表達(dá)式的重復(fù)字符符號描述{n}匹配前一項n次{n,}匹配前一項n次,或者多次{n,m}匹配前一項至少n次,最多m次*匹配前一項0次或多次,等價于{0,}+匹配前一項1次或多次,等價于{1,}?匹配前一項0次或1次,也就是說前一項是可靠的,等價于{0,1}經(jīng)驗:使用反斜杠”\”來進(jìn)行字符轉(zhuǎn)義,將上表中元字符作為普通字符來進(jìn)行匹配。如\$匹配美元符號,\*、\.、\+分別區(qū)別星號、點號、加號。匹配Email符號:/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/解讀:必須包含@符號和.符號,且.在@之前。@符號前的字符可以包含任意數(shù)量的\w-+.但第一個最后一個不能是-+.@符號與.符號之間的字符可以包含任意數(shù)量的\w-.但第一個最后一個不能是-..符號之后的字符可以包含任意數(shù)量的\w-.但第一個最后一個不能是-.-+.符號不能相鄰正則表達(dá)式中|或者關(guān)系運算符的用法:|與|之間是獨立部分,用”(“和”)”指向開始和結(jié)束4、RegExp(正則表達(dá)式)對象的常用方法檢測一個字符串是否匹配某個正則表達(dá)式:正則表達(dá)式對象實例.test(字符串); //返回true或false檢索字符中正則表達(dá)式的匹配,返回找到的值,并確定其位置 正則表達(dá)式對象實例.exec(字符串);String對象的方法符號描述match(字符串|reg對象)找到一個或多個正則表達(dá)式的匹配search檢索與正則表達(dá)式相匹配的值replace(reg對象|字符串,”新的字符串”)替換與正則表達(dá)式匹配的字符串split(分割符,n)把字符串分割為字符串?dāng)?shù)組5、使用下拉列表框?qū)崿F(xiàn)級聯(lián)效果select對象的常用事件、方法、屬性類別名稱描述事件onchange當(dāng)改變選項時調(diào)用的事件方法add(new,old)向下拉列表框中添加一個選項,old為空,加在最后屬性options[]返回包含下拉列表框中的所有選項的一個數(shù)組selectedIndex設(shè)置或返回下拉列表框中的被選項目的索引號length返回下拉列表框中的選項的數(shù)目設(shè)置options.length=0可以清除select對象的所有選項Option對象的常用屬性屬性描述text設(shè)置或返回某個選項的純文本值,即<option>標(biāo)簽開始和結(jié)束之間的值value設(shè)置或返回被送往服務(wù)器的值為selectObj創(chuàng)建一個新的option選項:varnewOption=newOption(text,value);selectObj.add(newOption,null);6、Array數(shù)組對象創(chuàng)建數(shù)組:var數(shù)組名稱=newArray(數(shù)組長度);為數(shù)組元素賦值:varfruit=newArray(“apple”,”orange”,”peach”,”bananer”);或varfruit=newArray(4);fruit[0]=“apple”;fruit[1]=“orange”;fruit[2]=“peach”;fruit[3]=“bananer”;訪問數(shù)組元素:數(shù)組名[下標(biāo)]數(shù)組對象的常見方法和屬性類別名稱描述方法sort排序join(分隔符)用分隔符將數(shù)組各元素連接成一個字符串reverse()反轉(zhuǎn)數(shù)組中的元素屬性length數(shù)組中元素的數(shù)目循環(huán)讀取數(shù)組中的每一個元素的方法:for(iinarra

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論