計算機一下第13周12章javascript基礎(chǔ)版

網(wǎng)頁設(shè)計與制作——網(wǎng)頁腳本語言JavaScript王海波Email:網(wǎng)頁設(shè)計與制作主要內(nèi)容JavaScript簡介JavaScript運行和編輯環(huán)境在網(wǎng)頁中使用JavaScriptJavaScript編程基礎(chǔ)JavaScript的事件驅(qū)動JavaScript的對象2023/3/262.JavaScript的作用JavaScript的目的是提供一種足夠簡單的語言，讓開發(fā)者能夠容易地為網(wǎng)頁增加交互效果。JavaScript首次出現(xiàn)時，最初目標是處理表單數(shù)據(jù)有效性驗證的問題，提高表單響應(yīng)效率。JavaScript將表單有效性驗證工作在瀏覽器內(nèi)完成，而不需要通過服務(wù)器端的程序來進行處理。JavaScript誕生時的名稱為LiveScript。在當(dāng)時計算機界有一門炙手可熱的語言——Java。為了推廣LiveScript，它被更名為JavaScript。2023/3/262.什么是JavaScriptJavaScript是一種面向?qū)ο?ObjectOriented)和事件驅(qū)動(EventDriven)的解釋性腳本語言。JavaScript特點腳本編寫語言面向?qū)ο蠛唵涡园踩詣討B(tài)性跨平臺性2023/3/263.JavaScript特點JavaScript是一種腳本語言，可以用“記事本”等文本編輯器直接對其進行編輯JavaScript是一種解釋性語言,其源代碼在發(fā)往瀏覽器執(zhí)行之前不需要編譯，由瀏覽器解釋執(zhí)行。（使用C、C++、Java等語言編寫的程序則必須經(jīng)過編譯，將源代碼轉(zhuǎn)換為二進制代碼之后才可以執(zhí)行）2023/3/262.JavaScript特點面向?qū)ο驤avaScript是一種面向?qū)ο蟮恼Z言，它能自已創(chuàng)建或運用JavaScript環(huán)境的內(nèi)建對象?？缙脚_性JavaScript是依賴于瀏覽器本身，與操作環(huán)境無關(guān)，只要瀏覽器支持JavaScript即可正確執(zhí)行。2023/3/26二、JavaScript運行和編輯環(huán)境運行環(huán)境:瀏覽器編輯環(huán)境任何可以編輯HTML文檔的文本編輯器或?qū)ｉT的網(wǎng)頁編輯器(FrontPage、SharepointDesigner、Dreamweaver、記事本、EditPlus、Ultraedit等。)

2023/3/26在網(wǎng)頁中使用JavaScript1三.把JavaScript程序和HTML結(jié)合起來的三種方式在標簽內(nèi)添加腳本在HTML元素標簽內(nèi)添加腳本使用<script>標簽嵌入腳本程序使用<script>標簽將JavaScript的腳本程序包含在HTML中鏈接外部腳本把腳本保存在一個擴展名為.js的文本文件中，通過<script>標簽引用。2023/3/26方法1：在標簽內(nèi)添加腳本方法在HTML元素標簽內(nèi)添加腳本，以響應(yīng)元素的事件。<inputname=“按鈕”type=“button”value=“猛擊這里"onClick="JavaScript:alert(‘HelloWorld!')">2023/3/26方法2：使用<script>標簽嵌入腳本程序方法：把腳本標記符<script></script>置于網(wǎng)頁上的head部分或body部分，然后在其中加入腳本程序。格式：

<scripttype="text/javascript"><!--在此編寫javascript代碼.//--></script>2023/3/26方法3：鏈接外部腳本方法當(dāng)同一段腳本在若干個web頁中使用，可以將腳本放在單獨的一個后綴是js的文件里，然后在任何需要該文件的web頁中調(diào)用該文件。引用時，使用script標記符的src屬性來指定外部腳本文件的URL。注：可以把.js文件放到網(wǎng)站目錄中如“js”的子目錄中，這樣更容易管理和維護。2023/3/26JavaScript語言基礎(chǔ)2四、JavaScript編程基礎(chǔ)基本數(shù)據(jù)類型變量運算符和表達式函數(shù)程序結(jié)構(gòu)2023/3/261、基本數(shù)據(jù)類型數(shù)值包括整數(shù)和浮點數(shù)。如:12.98,6e8,2.6e5等。字符串型用“”號或‘’括起來的任意數(shù)量的字符，0個字符也可以。如：“123”,”abc123”,”Thisisabook”布爾型

true或falseNullUndefined2023/3/262.常量和變量常量是保持不變的量。PI=

3.141592654變量主要用于存取數(shù)據(jù)，提供存放數(shù)據(jù)的容器。X+10=100X=PI*r22023/3/261)變量的命名JavaScript中的變量命名要注意以下幾點：變量對大小寫敏感。

例：username和userName是2個變量。必須以字母或下劃線_開頭，變量名稱不能有空格、＋、－、，或其它特殊符號。

例：”username”是一個錯誤的變量名不能使用JavaScript中的關(guān)鍵字作為變量。

2023/3/262)變量的聲明在JavaScript中，變量用關(guān)鍵詞var作聲明：

如varmBookName;如varmBookName=“JavaScript編程寶典”;2023/3/263.運算符和表達式運算符：是完成操作的一系列符號,也稱操作符。算術(shù)運算符:+、-、*、/、%、++、--字符串運算符:+（連接兩個字符串）位運算符：&,|,^,-,~,<<,>>等比較運算符:<、>、<=、>=、==、!=邏輯運算符:&&、||、!條件運算符：條件？結(jié)果1:結(jié)果2(若條件為真，則表達式的值為“結(jié)果1”，否則為”結(jié)果2”)2023/3/263.運算符和表達式表達式它是變量、常量、布爾及運算符的集合表達式可以分為算術(shù)表述式、字符串表達式、賦值表達式以及布爾表達式等。2023/3/26例:數(shù)字相加2+3例：字符串拼接“中國”+”傳媒大學(xué)”4.JavaScript中的函數(shù)函數(shù)是能夠完成一定功能的代碼塊，可以起到代碼重用的效果。應(yīng)用函數(shù)實現(xiàn)一定功能時，需要先定義函數(shù)，然后調(diào)用函數(shù)。function

函數(shù)名（參數(shù)1,參數(shù)2，…）{語句段;…return表達式;}2023/3/264.JavaScript中的函數(shù)說明函數(shù)由關(guān)鍵字function定義。函數(shù)名：調(diào)用函數(shù)時引用的名稱。函數(shù)名對大小寫是敏感的。參數(shù)表:調(diào)用函數(shù)時接受傳入數(shù)值的變量名。大括號中的語句是函數(shù)的執(zhí)行語句，當(dāng)函數(shù)被調(diào)用時執(zhí)行。如果需要返回值，可以使用return語句，需要返回的值放在return之后。如果return后沒有指明數(shù)值或沒有使用return語句，則函數(shù)返回值為不確定值。2023/3/265.程序結(jié)構(gòu)在所有的編程語言中，基本的程序結(jié)構(gòu)只有三種：2023/3/26順序結(jié)構(gòu)條件結(jié)構(gòu)循環(huán)結(jié)構(gòu)語句A語句B語句C語句A語句B語句C判斷語句A語句B語句C條件結(jié)構(gòu)中的基本語句——if基本格式if（表述式）

{

語句段１；

}else{

語句段２；

}功能若表達式為true，則執(zhí)行語句段１；否則執(zhí)行語句段２循環(huán)結(jié)構(gòu)forwhiledowhile循環(huán)結(jié)構(gòu)中的基本語句——for基本格式for（初始化參數(shù)；條件；增量）{語句段；}功能實現(xiàn)條件循環(huán)，當(dāng)條件成立時，執(zhí)行語句段，否則跳出循環(huán)體。循環(huán)結(jié)構(gòu)中的基本語句——while基本格式while（條件）

{

語句段；

}該語句與for語句一樣，當(dāng)條件為真時，重復(fù)循環(huán)，否則退出循環(huán)。

循環(huán)結(jié)構(gòu)中的基本語句——dowhile語句格式

do{

語句段;}while(條件)說明首先執(zhí)行循環(huán)體語句，再判別條件。如果表達式的值為真，則執(zhí)行循環(huán)體語句，否則退出循環(huán)。2023/3/26JavaScript中的對象3JavaScript中的對象JavaScript中的對象分為三類：JavaScript中的對象JavaScript中的對象是由屬性(properties)和方法(methods)兩個基本的元素構(gòu)成的。屬性：用來描述對象特性的一組數(shù)據(jù)方法：用來操作對象的若干動作訪問對象的屬性或方法對象名.屬性對象名.方法BOM模型和DOM模型BOM:BrowserObjectModel,提供了訪問瀏覽器各種功能部件的途徑DOM:DocumentObjectModel,提供了訪問瀏覽器中網(wǎng)頁文檔各元素的途徑，包括頁面中的超鏈接、表單、表格、圖像等各種HTML元素以及內(nèi)容。瀏覽器對象模型——BOM模型window對象是頂層對象，其它對象都是window對象的子對象。瀏覽器對象模型——BOM模型對象含義常用屬性或方法window表示瀏覽器窗口alert():創(chuàng)建一個具有說明信息的對話框open():打開另一個瀏覽器窗口close():關(guān)閉瀏覽器窗口setInterval():設(shè)置計時器clearInterval():清除計時器document當(dāng)前瀏覽器窗口中的文檔，使用它可以訪問到文檔中的所有其他對象（如圖像、表單等）write()：向當(dāng)前窗口輸出內(nèi)容getElementById():獲得網(wǎng)頁中的指定id的元素瀏覽器對象模型——BOM模型對象含義常用屬性或方法history記錄瀏覽器的瀏覽歷史back():返回當(dāng)前頁面之前的頁面forword():前進到當(dāng)前頁面之后的頁面location存儲當(dāng)前顯示的網(wǎng)頁的地址href屬性：表示瀏覽器的URL地址navigator提供瀏覽器的各種信息，如瀏覽器名稱、版本等screen提供顯示器屏幕相關(guān)的信息，如寬度、高度文檔對象模型——DOM模型DOM將把整個頁面規(guī)劃成由節(jié)點層級構(gòu)成的文檔。HTML文檔中的所有節(jié)點組成了一個文檔樹JavaScript內(nèi)置對象字符串對象String日期對象Date數(shù)學(xué)對象Math數(shù)組對象Array2023/3/26JavaScript內(nèi)置對象——字符串對象StringString對象，用來存放字符串屬性length:表示字符串中所有字符的個數(shù)，包括所有符號。例如：str是一個表示“網(wǎng)頁設(shè)計與制作”的字符串str.length

的值將是：7方法：substring(start,end)indexOf(str)2023/3/26JavaScript內(nèi)置對象——日期對象DateDate對象用于處理日期和時間。mDate=newDate();//創(chuàng)建代表當(dāng)前時間的變量mDate=newDate(“2014/05/20”);//創(chuàng)建代表2014年5月20日的時間變量2023/3/26JavaScript內(nèi)置對象——日期對象DateDate對象的主要方法：getFullYear()：獲得日期中的年getMonth()：獲得日期中的月getDate()：獲得日期中的日getHours():獲得日期中的小時getMinutes()：獲得日期中的分鐘getTime():獲得距離1970年1月1日的毫秒數(shù)2023/3/26JavaScript內(nèi)置對象——數(shù)學(xué)對象MathMath對象提供了一些數(shù)學(xué)常量和各種數(shù)學(xué)處理方法，如求絕對值、最大值、最小值、四舍五入等。Math對象的一些方法：abs(x):返回x的絕對值log(x):返回x的自然對數(shù)max(x,y):返回x和y的較大值round(x):對x進行四舍五入，返回整數(shù)部分random():返回0.0——1.0之間的隨機數(shù)2023/3/26JavaScript內(nèi)置對象——數(shù)組對