1、目錄 1.HTML/CSS/JavaScript先睹為快 2.HTML 3.CSS 4.JavaScript1.1 HTML代碼 未使用css，JavaScript的html網(wǎng)頁(yè) 未使用css，JavaScript的html網(wǎng)頁(yè)這是一個(gè)未使用css，JavaScript的html網(wǎng)頁(yè) 使用記事本即可編寫(xiě)HTML代碼，擴(kuò)展名是html或htm。使用瀏覽器就可以查看其效果。1.2 CSS代碼 使用了css的html網(wǎng)頁(yè) h2 font-size:50 pfont-size:20;font-style:italic 使用了css的html網(wǎng)頁(yè)這是一個(gè)使用了css的html網(wǎng)頁(yè) 1.3 JavaScr

2、ipt代碼 使用了css和JavaScript的html網(wǎng)頁(yè) h2 font-size:50 pfont-size:20;font-style:italic alert(這是JavaScript起的作用); 使用了css和JavaScript的html網(wǎng)頁(yè)這是一個(gè)使用了css和JavaScript的html網(wǎng)頁(yè) 1.4 HTML、CSS、JavaScript的角色 HTML：超文本標(biāo)記語(yǔ)言。是網(wǎng)頁(yè)設(shè)計(jì)的主要語(yǔ)言。無(wú)論網(wǎng)頁(yè)是否包括動(dòng)畫(huà)、多媒體、圖形等各種復(fù)雜的元素，其基本架構(gòu)都是HTML. CSS：層疊樣式表。是目前唯一的網(wǎng)頁(yè)排版樣式標(biāo)準(zhǔn)，彌補(bǔ)了HTML在網(wǎng)頁(yè)格式化方面的不足，幫助用戶(hù)對(duì)頁(yè)面的布

3、局加以更多的控制。 JavaScript用于開(kāi)發(fā)Internet客戶(hù)端應(yīng)用程序，實(shí)現(xiàn)了一種實(shí)時(shí)、動(dòng)態(tài)、交互的頁(yè)面功能。它的出現(xiàn)使靜態(tài)的HTML頁(yè)面逐漸本客戶(hù)端可做出響應(yīng)的動(dòng)態(tài)頁(yè)面所取代。 可以在HTML語(yǔ)言中直接編寫(xiě)CSS和JavaScript代碼，也可以獨(dú)立編寫(xiě)。擴(kuò)展名分別是.css和.js2 HTML 1:HTML簡(jiǎn)介 2:基本標(biāo)記 3:列表list 4:表格table 5:表單form 6:框架frame 7:層div2.1.1 HTML概念HTMLHyper Text Markup Language 超文本標(biāo)識(shí)語(yǔ)言是一種用來(lái)制作超文本文檔的簡(jiǎn)單標(biāo)記語(yǔ)言。用HTML編寫(xiě)的超文本文檔稱(chēng)為H

4、TML文檔HTML文檔：*.htm或*.html文件名區(qū)分大小寫(xiě)瀏覽HTML文件的工具:瀏覽器例：Netscape Navigator ,Microsoft IE,Mazilla FireFox1.手工直接編寫(xiě)記事本等，存成.htm .html格式，要求用戶(hù)必須掌握HTML2.使用可視化HTML編 輯 器Frontpage、Dreamweaver等,容易產(chǎn)生廢碼 my first page This is my first homepage! 這是我的第一張網(wǎng)頁(yè)！ 標(biāo)記(簽)是HTML語(yǔ)言的基本部分，比如、。大多數(shù)標(biāo)記總是成對(duì)出現(xiàn)，每一對(duì)標(biāo)記一般都有一個(gè)開(kāi)始的標(biāo)記并且結(jié)束的標(biāo)記總是在開(kāi)始的標(biāo)記

5、前加一個(gè)斜杠。屬性：HTML標(biāo)記有自己的相關(guān)屬性，每一個(gè)屬性還可以由我們網(wǎng)頁(yè)編制者賦一定的值。 my first homepage 注意： 標(biāo)記不區(qū)分大小寫(xiě)。例都可以 標(biāo)記中不要有空格，否則瀏覽器無(wú)法識(shí)別。例錯(cuò)誤 任何空格和回車(chē)在代碼中無(wú)效。插入空格和回車(chē)分別用 和  屬性的值可以用雙引號(hào)引起來(lái)，也可以不引，最好引起來(lái) 各屬性之間無(wú)先后次序，屬性也可省略（即取默認(rèn)值） 標(biāo)記出現(xiàn)在文檔的開(kāi)頭部分。 與之間的內(nèi)容不會(huì)在瀏覽器的文檔窗口顯示，但是其間的元素有特殊重要的意義。 1: 標(biāo)記定義HTML文檔的標(biāo)題。 與之間的內(nèi)容將顯示在瀏覽器窗口的標(biāo)題欄。2:標(biāo)記 標(biāo)記定義網(wǎng)頁(yè)的一些相關(guān)

6、信息，例文件的關(guān)鍵字，作者，網(wǎng)頁(yè)過(guò)期時(shí)間等，這些信息不會(huì)在瀏覽器的文檔窗口顯示 用來(lái)標(biāo)記搜索引擎在搜索你的頁(yè)面時(shí)所取出的關(guān)鍵詞。 用來(lái)標(biāo)記文檔的作者。 用來(lái)標(biāo)記你的頁(yè)面的解碼方式。 用來(lái)自動(dòng)刷新網(wǎng)頁(yè)編寫(xiě)一個(gè)網(wǎng)頁(yè)，要求3秒鐘后自動(dòng)跳轉(zhuǎn)到北軟教育首頁(yè)。 my first page 三秒鐘后本網(wǎng)頁(yè)將自動(dòng)跳轉(zhuǎn)到北軟教育首頁(yè) 表明是HTML文檔內(nèi)容主體部分。在與之間，通常都會(huì)有很多其它標(biāo)記；這些標(biāo)記和標(biāo)記屬性構(gòu)成HTML文檔的主體部分。 自身屬性主要有： 1)bgcolorbgcolor屬性標(biāo)志HTML文檔的背景顏色。如：bgcolor=#CCFFCC。 2)backgroundbackground屬性

7、標(biāo)志HTML文檔的背景圖片?？梢允褂玫膱D片格式為gif,jpg如：background=“images/bg.gif。 3)texttext屬性標(biāo)志HTML文檔的正文文字顏色。如：text=“#FF6666”。text定義的顏色將應(yīng)用于整篇文檔。顏色顏色名和RGB值黑色Black=”#000000”銀色紅色藍(lán)色白色黃色綠色海藍(lán)色2 基本 HTML 標(biāo)記 1.標(biāo)題標(biāo)記 2.文字標(biāo)記 3.段落級(jí)標(biāo)記 4.字符級(jí)標(biāo)記 5.水平標(biāo)尺標(biāo)記 6.HTML注釋 6.超級(jí)鏈接 7.圖像標(biāo)記 8.移動(dòng)的文字2.1 標(biāo)題標(biāo)記 可顯示六種大小的標(biāo)題，即到，為最大，為最小 HTML 簡(jiǎn)介 HTML 簡(jiǎn)介 HTML 簡(jiǎn)

8、介 HTML 簡(jiǎn)介 HTML 簡(jiǎn)介 HTML 簡(jiǎn)介 HTML 簡(jiǎn)介 文字屬性標(biāo)記1.文字顏色 . #=RRGGBB 16 進(jìn)制數(shù)碼2.文字字體 . #=客戶(hù)端可獲得的字體3.文字大小 . #=1, 2, 3, 4, 5, 6, 7等2.3.段落級(jí)標(biāo)記 段落標(biāo)記(paragraph) 換行符標(biāo)記 預(yù)格式化標(biāo)記： HTML的段落與段落之間有一定的空隔。 如果不希望出現(xiàn)空隔而只想換行的話(huà)，就要用到另一個(gè)元素，即元素。 利用標(biāo)記對(duì)網(wǎng)頁(yè)中文字段落進(jìn)行預(yù)格式化，在輸入過(guò)程中，按鍵盤(pán)上的回車(chē)鍵，就可以生成一個(gè)段落。即瀏覽器會(huì)以文本輸入格式顯示 用三種標(biāo)記分別實(shí)現(xiàn)登鸛雀樓的顯示2.4 字符級(jí)標(biāo)記 常用字符級(jí)標(biāo)

9、記 傾斜文本 粗體文本 下劃線(xiàn)文本 刪除線(xiàn)文本 強(qiáng)調(diào)文本 居中顯示文本 空格標(biāo)記 2.5 水平線(xiàn)標(biāo)記 水平線(xiàn) ：設(shè)定線(xiàn)寬 ：設(shè)定線(xiàn)長(zhǎng) ：設(shè)定對(duì)齊方式 #=left, right ：設(shè)定線(xiàn)的顏色 2.6 HTML注釋 HTML文檔可以插入注釋。不但便于對(duì)程序排錯(cuò)，也使其他人更易讀懂自己的代碼 HTML注釋的格式為：源碼依然存在，不會(huì)被瀏覽器所解釋 注釋語(yǔ)句的特點(diǎn)是僅用于程序中某一句或一段語(yǔ)句的作用說(shuō)明，瀏覽器在執(zhí)行過(guò)程中將忽略掉注釋語(yǔ)句的內(nèi)容，對(duì)其視而不見(jiàn)。 2.7 超級(jí)鏈接超級(jí)鏈接是用錨元素定義的 在元素下，有元素屬性href,href的屬性值為一個(gè)URL地址如：指向?qū)W院的超

10、級(jí)鏈接 如：普通超級(jí)鏈接如：普通超級(jí)鏈接 開(kāi)一個(gè)新的(瀏覽器)窗口 (Target Window) . 2.7 超級(jí)鏈接超級(jí)鏈接的路徑 絕對(duì)路徑：指文件的完整路徑，包括協(xié)議，主機(jī)地址等，一般用于網(wǎng)站的外部鏈接。 http:/ :8080/digitalhome/a.jpg 相對(duì)路徑：指相對(duì)于當(dāng)前文件的路徑，它包含了從當(dāng)前文件指向目的文件的路徑，一般用于網(wǎng)站的內(nèi)部鏈接。相對(duì)位置如何輸入同一目錄輸入要鏈接的文檔名鏈接上一目錄先輸入./，再輸入目錄名鏈接下一目錄先輸入目錄名，后加/2.8 圖像標(biāo)記 的基本屬性是src屬性，src的屬性值為所引用的圖片的URL地址。 sr

11、c屬性是必須的。src的URL可以是絕對(duì)地址，也可以是相對(duì)地址 width指定寬度，height指定高度。它們的屬性值可以是象素，也可以是%。 定義圖片替代文本的方法是： 替代文本有兩個(gè)作用： 提示：若圖片下載成功，把鼠標(biāo)放在圖片上，會(huì)出現(xiàn)提示文本。 替代：若圖片下載不成功，在圖片位置出現(xiàn)替代文本。圖片的對(duì)齊方式 #=left,right,top,middle,bottom2.8 圖像標(biāo)記 HTML 文檔中的圖片GIF（Graphics Interchange Format ）圖像 (.GIF) 支持無(wú)損壓縮 只支持256色JPEG（Joint Photographic Experts Gro

12、up）圖像 (.JPG) 有損壓縮 ，但這個(gè)損失是剔除一些視覺(jué)上不易察覺(jué)的部分。 通常用來(lái)保存超過(guò)256色的圖片文件PNG（Portable Network Graphics ） 新興的網(wǎng)絡(luò)圖片格式，結(jié)合了gif和jpeg的優(yōu)點(diǎn)。 可以將圖片文件以最小的方式壓縮而不造成圖片失真 支持48bit的色彩。2.8 圖像標(biāo)記 圖像的超級(jí)鏈接 圖像的超級(jí)鏈接是指整個(gè)圖像的超級(jí)鏈接，當(dāng)點(diǎn)擊圖像的任何部分時(shí)，都會(huì)打開(kāi)這個(gè)超級(jí)鏈接。定義默認(rèn)超級(jí)鏈接的方法是： 圖像的熱區(qū)鏈接熱區(qū)就是在圖片中特意劃分出一個(gè)熱點(diǎn)區(qū)域。當(dāng)點(diǎn)擊圖象的熱區(qū)時(shí)，才會(huì)打開(kāi)這個(gè)超級(jí)鏈接。需要使用map標(biāo)記指定熱區(qū)。2.9 移動(dòng)的文字1.基本語(yǔ)

13、法 . 2.文字移動(dòng)屬性(1)方向 ：direction=#=left, right,up,down(2)方式： behavior=# #=scroll(循環(huán)), slide(只走一次), alternate(來(lái)回走)(3)循環(huán): loop=# #=次數(shù)；若未指定則循環(huán)不止(infinite) (4)速度: scrollamount=#(5)延時(shí): scrolldelay=#2.3.1 無(wú)序列表 無(wú)序列表由和元素定義的: sportsfood drink friends 無(wú)序列表的默認(rèn)符號(hào)是圓點(diǎn)。 元素有type屬性，通過(guò)定義不同的type屬性可以改變列表的項(xiàng)目符號(hào)。目前，type屬性的屬性值

14、有：disc(圓)、circle （圓圈）、square（方塊） 支持嵌套定義2.3.2 有序列表 有序列表由和定義: sports drink friends 元素也有自己的type屬性，type屬性的屬性值有1、A、a、I、i等。例如，我們以A、B、C作為列表的編號(hào) 元素還可以定義列表的起始編號(hào)，如我們希望列表的第一個(gè)編號(hào)為5，而不是1，則需要定義元素的start屬性 支持嵌套定義2.4.1 表格的基本結(jié)構(gòu)定義表格定義表頭定義表行定義單元格.定義表行定義單元格2.4.1 表格的基本結(jié)構(gòu) 元素：定義一個(gè)表格。每一個(gè)表格只有一對(duì)和，一張頁(yè)面中可以有多個(gè)表格。 元素：定義表格的行，一個(gè)表格可以有

15、多行，所以對(duì)于一個(gè)表格來(lái)說(shuō)不是唯一的。 元素：定義表格的一個(gè)單元格。每行可以有不同數(shù)量的單元格，在和之間是單元格的具體內(nèi)容。 需要注意的是：上述的三個(gè)元素必須、而且只能夠配對(duì)使用。缺少任何一個(gè)元素，都無(wú)法定義出一個(gè)表格。 元素：定義表格的表頭行，一個(gè)表格只能有一個(gè)表頭行或者沒(méi)有，所以對(duì)于一個(gè)表格來(lái)說(shuō)是唯一的或沒(méi)有。2.4.2 表格的屬性 表格的屬性 width屬性：指定表格或某一個(gè)表格單元格的寬度。單位可以是%或者象素。height屬性：指定表格或某一個(gè)表格單元格的高度。單位可以是%或者象素。border屬性：表格邊線(xiàn)粗細(xì)bgcolor屬性：指定表格或某一個(gè)單元格的背景顏色。backgroun

16、d屬性：指定表格或某一個(gè)單元格的背景圖片。其屬性值為一個(gè)URL地址align屬性：指定表格或某一個(gè)單元格里的內(nèi)容（文本、圖片等）的對(duì)齊方式(left,center,right)。2.4.3 單元格的屬性 單元格屬性valign屬性：指定某一個(gè)單元格里的內(nèi)容（文本、圖片等）的垂直對(duì)齊方式。垂直對(duì)齊方式的屬性值包括： top：頂端對(duì)齊； middle：居中對(duì)齊； bottom：底端對(duì)齊; baseline：相對(duì)于基線(xiàn)對(duì)齊;align屬性：指定某一個(gè)單元格里的內(nèi)容（文本、圖片等）的水平對(duì)齊方式（left,center,right）colspan：屬性值表示當(dāng)前單元格跨越幾列rowspan：屬性值表示

17、當(dāng)前單元格跨越幾行2.4.4 行的屬性 行屬性1、valign屬性：指定某一個(gè)單元格里的內(nèi)容（文本、圖片等）的垂直對(duì)齊方式。垂直對(duì)齊方式的屬性值包 top：頂端對(duì)齊； middle：居中對(duì)齊；bottom：底端對(duì)齊。 baseline：相對(duì)于基線(xiàn)對(duì)齊。2、align屬性：指定表格或某一個(gè)單元格里的內(nèi)容（文本、圖片等）的水平對(duì)齊方式(left,center,right)3、height屬性：指定表格中某一行的高度。單位可以是%或者象素2.4.5 表格的嵌套 在 之間插入表格，實(shí)現(xiàn)表格嵌套導(dǎo)航列表計(jì)算機(jī)政治軍事法律正文內(nèi)容2.4.5 表格的作用 表格是用于在 HTML 頁(yè)面上設(shè)計(jì)數(shù)據(jù)和圖像布局的常

18、用工具，可使用表格來(lái)組織數(shù)據(jù)，控制頁(yè)面布局 制作網(wǎng)頁(yè)時(shí)，為了以一定的形式將網(wǎng)頁(yè)中的信息組織起來(lái)，同時(shí)使網(wǎng)頁(yè)便于閱讀和頁(yè)面美觀，需要對(duì)頁(yè)面的版式進(jìn)行設(shè)計(jì)或進(jìn)行頁(yè)面 布局。而表格能將網(wǎng)頁(yè)分成多個(gè)任意的矩形區(qū)域，表格是網(wǎng)頁(yè)制作中是常用的一種簡(jiǎn)單布局工具。 表格的作用一般只是控制文本和圖像的顯示，而不顯示表格的邊框2.4.6 表格舉例 第一季度第一季度第二季度第二季度 一月一月二月二月三月三月四月四月五月五月六月六月1000550240150027651240 30002430250012509003400 2.5.1 表單form HTML表單是HTML頁(yè)面與瀏覽器端實(shí)現(xiàn)交互的重要手段。利用表單可以

19、收集客戶(hù)端提交的有關(guān)信息。 在HTML里，我們可以定義表單，并且使表單與CGI或ASP等服務(wù)器端的表單處理程序配合。我們?cè)诰W(wǎng)頁(yè)設(shè)計(jì)課程中不會(huì)涉及程序編制。 表單是網(wǎng)頁(yè)上的一個(gè)特定區(qū)域。這個(gè)區(qū)域是由一對(duì)元素定義的。 2.5.2 表單舉例 設(shè)計(jì)一個(gè)注冊(cè)表單，輸入姓名，年齡，密碼，密碼確認(rèn)，電子郵件，性別，愛(ài)好，身份，個(gè)人簡(jiǎn)歷，單擊提交按鈕提交，單擊重置按鈕重置。 姓名，年齡，電子郵件：text 密碼，密碼確認(rèn)：password 性別：radio 愛(ài)好：checkbox 身份：select 個(gè)人簡(jiǎn)歷：textarea 提交按鈕：submit 重置按鈕：reset2.5.2 表單舉例2.5.2 表單舉

20、例 姓名 密碼 密碼確認(rèn) 性別 男 女 年齡 電子郵件 愛(ài)好體育 音樂(lè) 美術(shù) 身份 學(xué)生 教師 解放軍 個(gè)人經(jīng)歷請(qǐng)輸入個(gè)人簡(jiǎn)歷 2.5.2 表單舉例2.5.2 表單舉例 姓名 密碼 密碼確認(rèn) 性別 男 女 年齡 2.5.2 表單舉例電子郵件 愛(ài)好 體育 音樂(lè) 美術(shù) 身份 學(xué)生 教師 解放軍 個(gè)人經(jīng)歷 請(qǐng)輸入個(gè)人簡(jiǎn)歷 2.5.3 表單基本語(yǔ)法1.表單的基本語(yǔ)法:. action屬性：用來(lái)定義表單處理程序（一個(gè)ASP、JSP等程序）的位置(相對(duì)地址或絕對(duì)地址)。 method定義表單結(jié)果從瀏覽器傳送到服務(wù)器的方法，一般有兩種方法：get、post。 GET有數(shù)據(jù)量限制，POST無(wú)以上限制,以文件形

21、式傳輸2.5.3 表單基本語(yǔ)法2.文本框的基本語(yǔ)法: ? 文本框的名字* 默認(rèn)值* 長(zhǎng)度? 最大輸入字符數(shù)3.密碼框的基本語(yǔ)法：數(shù)據(jù)以圓點(diǎn)形式顯示，提高密碼安全性2.5.3 表單基本語(yǔ)法3.復(fù)選框的基本語(yǔ)法: 在一個(gè)表單里的所有多選框可以有一個(gè)或多個(gè)被選中。 /默認(rèn)選中 4.單選框的基本語(yǔ)法: 一個(gè)表單里的所有變量名相同的單選框只能夠有一個(gè)被選中。 / 默認(rèn)選中 各個(gè)選項(xiàng)的name必須一樣才能達(dá)到預(yù)期效果5.標(biāo)準(zhǔn)按鈕的基本語(yǔ)法: 2.5.3 表單基本語(yǔ)法6.提交按鈕和重置按鈕的基本語(yǔ)法:7.圖象域的基本語(yǔ)法:：相當(dāng)于漂亮的submit按鈕。 8. 隱藏域的基本語(yǔ)法 隱藏域在網(wǎng)頁(yè)中對(duì)用戶(hù)是不可見(jiàn)

22、的，用戶(hù)單擊提交按鈕提交表單時(shí)，隱藏域的信息也被一起發(fā)送到服務(wù)器。 2.5.3 表單基本語(yǔ)法9.文本區(qū)域的基本語(yǔ)法: . 10.下拉菜單的基本語(yǔ)法 音樂(lè) 美術(shù) 體育 2.5.3 表單基本語(yǔ)法TYPE此屬性指定表單元素的類(lèi)型?？捎玫倪x項(xiàng)有TEXT、PASSWORD、CHECKBOX、RADIO、SUBMIT、RESET、FILE、HIDDEN和BUTTON。默認(rèn)值為T(mén)EXT。NAME此屬性指定表單元素的名稱(chēng)。例如，如果表單上有幾個(gè)文本框，可以按照名稱(chēng)來(lái)標(biāo)識(shí)它們 - TEXT1、TEXT2或用戶(hù)選擇的任何名稱(chēng)。 VALUE此屬性是可選屬性，它指定表單元素的初始值 SIZE此屬性指定表單元素的顯示長(zhǎng)

23、度。用于文本輸入的表單元素即輸入類(lèi)型是TEXT或PASSWORD的 MAXLENGHT此屬性用于指定在TEXT或PASSWORD表單元素中可以輸入的最大字符數(shù)。默認(rèn)值為無(wú)限的 CHECKED此屬性是一個(gè)Boolean屬性，指定按鈕是否是被選中的。當(dāng)輸入類(lèi)型為RADIO或CHECKBOX時(shí)，使用此屬性。 SRCSRC=URL。當(dāng)使用IMAGE作為輸入類(lèi)型時(shí)使用此屬性，它用于標(biāo)識(shí)圖像的位置。 2.6.1 框架舉例 2.6.1 框架舉例 框架的嵌套框架的嵌套 2.6.2 框架簡(jiǎn)介 框架是一種在一個(gè)網(wǎng)頁(yè)中顯示多個(gè)網(wǎng)頁(yè)的技術(shù)，通過(guò)超級(jí)鏈接可以為框架之間建立內(nèi)容之間的聯(lián)系，從而實(shí)現(xiàn)頁(yè)面導(dǎo)航。 在網(wǎng)頁(yè)文件中

24、，框架常用于網(wǎng)頁(yè)的布局。 框架的基本結(jié)構(gòu)分為框架集frameset和框架frame兩個(gè)部分。 使用框架集的頁(yè)面的標(biāo)記將被標(biāo)記替代，然后在利用標(biāo)記去定義框架結(jié)構(gòu)。 每個(gè)框架frame由一個(gè)單獨(dú)的 HTML 頁(yè)面組成。 框架支持嵌套。當(dāng)一個(gè)框架集中既有左右分割，又有上下分割是，就要用到框架嵌套。2.6.2 framset基本語(yǔ)法 框架由一對(duì)定義有兩個(gè)屬性：rows和colsrows定義上下分割的框架的大小；cols定義左右分割的框架的大小；在定義大小時(shí)，rows和cols可使用相對(duì)大小或以百分比為單位2.6.2 frame基本語(yǔ)法 的屬性 src：在本框架里顯示的網(wǎng)頁(yè)的URL。frameborde

25、r：是否顯示邊框name：定義該框架的名字。這個(gè)名字可以被一些網(wǎng)頁(yè)元素引用，如被元素引用。noresize：框架在瀏覽器里不可以被調(diào)整大小。scrolling：是否顯示滾動(dòng)條。yes, no, auto2.6.2 frame基本語(yǔ)法 left.html:快樂(lè)的生活在當(dāng)前框架中打開(kāi)超鏈接頁(yè)面 默認(rèn)就是在當(dāng)前框架頁(yè)中打開(kāi),也可以采用 target=“_self”在指定框架中打開(kāi)超級(jí)鏈接頁(yè)面 target=“name”新開(kāi)窗口打開(kāi)鏈接頁(yè)面 target=“_blank”跳出整個(gè)框架集 target=“_parent”2.7.1 圖層 圖層也是網(wǎng)頁(yè)制作中用于定位元素或布局的一種技術(shù)，圖層比表格的布局更

26、加靈活，它能夠?qū)又械膬?nèi)容擺放到瀏覽器的任意位置，放入到層中的HTML元素包括：文字、圖像、動(dòng)畫(huà)甚至是圖層。 一個(gè)網(wǎng)頁(yè)中可以使用多個(gè)層，層與層之間可以重疊，在網(wǎng)頁(yè)制作中，使用層可以將網(wǎng)頁(yè)中的任何元素布局到網(wǎng)頁(yè)的任意位置，同時(shí)可以以任何方式重疊。 可以想象在word文檔中不同圖片之間的上下左右位置和前后重疊關(guān)系。 圖層也可以實(shí)現(xiàn)嵌套的功能。嵌套圖層最主要的特點(diǎn)就是可以保證子層永遠(yuǎn)位于父層之上。2.7.2 圖層舉例將元素分組 第一層這是第一部分內(nèi)的一個(gè)段落元素第一層的內(nèi)容。該部分之外第二部分這是第二部分內(nèi)的一個(gè)段第一層的內(nèi)容。 2.7.3 圖層屬性講解 基本語(yǔ)法 /設(shè)置圖層背景色 . /圖層的具體

27、內(nèi)容 3.1 CSS的作用 CSS是Cascading Style Sheets(層疊樣式表)的簡(jiǎn)稱(chēng).,是一系列格式規(guī)則，它們控制網(wǎng)頁(yè)內(nèi)容的外觀。css簡(jiǎn)單來(lái)說(shuō)就是用來(lái)美化網(wǎng)頁(yè)用的。 使用CSS樣式可以非常靈活并更好地控制確切的網(wǎng)頁(yè)外觀，從精確的布局定位到特定的字體和樣式。 即使不改動(dòng)HTML，只是通過(guò)添加不同的CSS規(guī)則，就可以得到各種不同樣式的網(wǎng)頁(yè)。 可以通過(guò)簡(jiǎn)單的更改CSS文件,改變網(wǎng)頁(yè)的整體表現(xiàn)形式,從而減少我們的工作量,所以她是每一個(gè)網(wǎng)頁(yè)設(shè)計(jì)人員的必修課. CSS可以嵌入到html文檔中，也可以單獨(dú)文件形式存在，擴(kuò)展名是.css3.1 CSS的作用 當(dāng)樣式定義在外部文件中時(shí)，一個(gè)樣式

28、表可以用于多個(gè)頁(yè)面，甚至整個(gè)工作點(diǎn)，因此具有更好的易用性和擴(kuò)展性。 總的來(lái)說(shuō)，CSS可以完成下列工作：（1）彌補(bǔ)HTML對(duì)網(wǎng)頁(yè)格式化功能的不足，如段落間距、行距等。（2）設(shè)置字體變化和大小。（3）設(shè)置頁(yè)面格式的動(dòng)態(tài)更新。（4）進(jìn)行排版定位。 CSS的特點(diǎn)（1）控制頁(yè)面中的每一個(gè)元素（精確定位）。（2）對(duì)HTML語(yǔ)言處理樣式的最好補(bǔ)充。（3）把內(nèi)容和格式處理相分離，減少工作量。3.2 樣式表規(guī)則 CSS的樣式規(guī)則 css樣式規(guī)則由兩部分組成：選擇器和聲明。 選擇器是樣式名稱(chēng)（如TR或P）。 聲明是用于定義樣式元素。 pfont-style:italic; font-weight:bold; co

29、lor:limegreen .water color:blue RuleSelector property:value;property: value; . 規(guī)則選擇器規(guī)則選擇器聲明聲明屬性屬性屬性值屬性值3.3 樣式表中的選擇器 1：簡(jiǎn)單選擇器(僅描述元素，而不考慮該元素在文檔結(jié)構(gòu)中的位置)1.1 HTML選擇器-選擇器是HTML標(biāo)記的名稱(chēng)1.2 類(lèi)選擇器使用HTML元素的CLASS屬性1.3 ID選擇器使用HTML元素的ID屬性 2：上下文選擇器(引用元素的上下文)3.3 樣式表中的選擇器 1.1：HTML選擇器示例選擇器示例h1, h2, h3, h4, h5, h6 color: gr

30、een Pfont-style:italic; font-weight:bold; color:red 測(cè)試HTML選擇器這些選擇器使用HTML元素的名稱(chēng)唯一區(qū)別是刪除了尖括號(hào)。3.3 樣式表中的選擇器 1.2：類(lèi)選擇器示例：類(lèi)選擇器示例.water color:blue; text-align:rightp.danger color:red; text-align:center 測(cè)試CSS測(cè)試水測(cè)試危險(xiǎn)無(wú)樣式3.3 樣式表中的選擇器 1.3：ID選擇器示例ID選擇器#control color:red這是火焰的顏色這是火焰的顏色本段沒(méi)有應(yīng)用樣式3.3 樣式表中的選擇器 所有的HTML標(biāo)簽都可

31、以作為類(lèi)選擇器。 省略HTML標(biāo)記的類(lèi)選擇器是最常用的CSS方法，使用這種方法，可以很方便的在任意元素上套用預(yù)先定義好的類(lèi)樣式 HTML頁(yè)面中ID參數(shù)指定了某個(gè)單一元素，ID選擇器用來(lái)對(duì)這個(gè)單一元素定義單獨(dú)的樣式。由于ID選擇器局限性很大，只能單獨(dú)定義某個(gè)元素的樣式，一般只在特殊情況下使用。 ID是先給某個(gè)元素定義標(biāo)簽，再給它定義樣式；class是先定義好一種樣式，再套給多個(gè)元素。 用多個(gè)相同ID“一般情況下”也能正常顯示。但是當(dāng)你需要用JavaScript通過(guò)id控制這個(gè)元素時(shí)(如div)，那就會(huì)出現(xiàn)錯(cuò)誤3.3 樣式表中的選擇器 2：上下文選擇器示例：上下文選擇器示例acolor:red;f

32、ont-size:20table acolor:green;font-size:25table a:hovercolor:blue北軟教育北軟教育北軟教育3.3 樣式表中的選擇器 2：上下文選擇器示例：上下文選擇器示例上下文選擇器 BODYcolor:blue;background:lavender;font-family:Arial; UL color:red ul acolor:green; font-size:15 芒果桔子蘋(píng)果芒果桔子蘋(píng)果3.4 在HTML中引用樣式表 1：使用Style元素 2：使用Style屬性 3：使用Link元素3.4 在HTML中引用樣式表 1：使用：使用St

33、yle元素元素STYLE元素應(yīng)插入文檔的元素部分中，所有規(guī)則都放置在開(kāi)始標(biāo)記和結(jié)束標(biāo)記之間。顯示頁(yè)面時(shí)，只有嵌入了STYLE元素的文檔會(huì)受到影響 H1 color:maroon; P color:hotpink; font-family:Arial;3.4 在HTML中引用樣式表 2：使用：使用Style屬性屬性style屬性用于將樣式表應(yīng)用于單個(gè)元素。直接將在HTML標(biāo)記里加入style參數(shù)，而style參數(shù)的內(nèi)容就是CSS的屬性和值。本段應(yīng)用了內(nèi)嵌樣式本段以默認(rèn)樣式顯示。您能發(fā)現(xiàn)本行中的不同之處嗎？3.4 在HTML中引用樣式表 3：使用：使用Link元素鏈入外部樣式表元素鏈入外部樣式表鏈

34、入外部樣式表是把樣式表保存為一個(gè)樣式表文件，然后在頁(yè)面中用標(biāo)記鏈接到這個(gè)樣式表文件，這個(gè)標(biāo)記必須放到頁(yè)面的區(qū)內(nèi) 設(shè)置屬性。3.5 樣式表屬性類(lèi)型CSS屬性值字體屬性font-familyArial，serif，宋體font-sizeSmall，medium，large或直接指定字體大小font-stylenormal, italicfont-weightnormal, bold, lighter, 100, 200文本屬性text-alignleft, right, center, justifytext-indent度量或%text-decorationnone, blink, underl

35、ine, overline, line-throughtext-transformnone, capitalize, uppercase, lowercasevertical-alignBaseline, super, sub, top, text-top, middle-bottom, text-bottomword-spacing度量letter-spacing度量3.5 樣式表屬性類(lèi)型CSS屬性值框?qū)傩詁orderNone, solid, double, ridge, inset, outset, groove, dotted dashedborder-style同上border-wid

36、th度量，thick，medium，thinborder-color#RRGGBB，顏色名稱(chēng)margin-top度量或%Margin-left度量或%定位屬性top度量width度量或%height度量或%left度量顏色屬性color#RRGGBB，顏色名稱(chēng)background-color#RRGGBB，顏色名稱(chēng)，transparentbackground-imageurlbackground-repeatrepeat, repeat-x, repeat-y, no-repeatJavaScript JavaScript概述 JavaScript基本語(yǔ)法 JavaScript事件 JavaS

37、cript對(duì)象4.1.1 JavaScript先睹為快 舉例舉例 在在HTML頁(yè)面中顯示頁(yè)面中顯示“你好你好,歡迎學(xué)習(xí)歡迎學(xué)習(xí)JavaScript！” 創(chuàng)建交互式的網(wǎng)頁(yè)創(chuàng)建交互式的網(wǎng)頁(yè)允許用戶(hù)以適當(dāng)?shù)母袷捷斎霐?shù)據(jù)；使用彈出窗口為用戶(hù)顯示信息等 控制瀏覽器的行為控制瀏覽器的行為 設(shè)置頁(yè)面的背景顏色； 在狀態(tài)欄顯示信息等 4.1.1 JavaScript先睹為快 用HTML代碼實(shí)現(xiàn)在頁(yè)面中顯示“你好,歡迎你學(xué)習(xí)JavaScript!”1、在、在HMTL中嵌入中嵌入JavaScript document.write(你好，歡迎你學(xué)習(xí)JavaScript！) 2、鏈接、鏈接JavaScript文件文件

38、 鏈接JavaScript代碼 test.js文件要顯示的內(nèi)容如下： document.write(你好，歡迎你學(xué)習(xí)JavaScript！)4.1.1 JavaScript先睹為快function checkPw() fm = document.form1;if (fm.pw2.value != fm.pw1.value) alert(密碼不符，請(qǐng)重新輸入); document.form1.pw2.select();else alert(謝謝你，+.value);姓名：輸入密碼：重新輸入：4.1.1 JavaScript先睹為快document.bgColor=green;doc

39、ument.fgColor=whitefunction mOver(object,msg) status = msg; object.color = red; object.face = 華文楷體; function mOut(object) status = 謝謝指向; object.color = blue; object.face = 黑體; Javapro技術(shù)學(xué)習(xí)網(wǎng)4.1.2 什么是JavaScript JavaScript是由Netscape（網(wǎng)景）公司研發(fā)出來(lái)的一種在它的Navigator瀏覽器上執(zhí)行的程序語(yǔ)言。 JavaScript是一種基于對(duì)象(object-based)和事件

40、驅(qū)動(dòng)(Event Driven)并具有安全性能的腳本語(yǔ)言。 使用它的目的是與HTML超文本標(biāo)記語(yǔ)言、Java 腳本語(yǔ)言（Java小程序）一起實(shí)現(xiàn)在一個(gè)Web頁(yè)面中連接多個(gè)對(duì)象，與Web客戶(hù)交互作用,從而可以開(kāi)發(fā)客戶(hù)端的應(yīng)用程序等。 它是通過(guò)嵌入或調(diào)入到標(biāo)準(zhǔn)的HTML語(yǔ)言中實(shí)現(xiàn)的。它的出現(xiàn)彌補(bǔ)了HTML語(yǔ)言只能制作靜態(tài)網(wǎng)頁(yè)的缺陷，它是Java與HTML折衷的選擇 4.1.3 JavaScript 的基本特點(diǎn) 1、腳本編寫(xiě)語(yǔ)言 腳本語(yǔ)言是一種簡(jiǎn)單的程序，這些程序是由一些ASCII字符構(gòu)成，可以使用任何一種文本編輯器編寫(xiě)。一些程序語(yǔ)言（如C、C+、Java等）都必須經(jīng)過(guò)編譯，將源代碼編譯成二進(jìn)制的可

41、執(zhí)行文件之后才能運(yùn)行，而腳本語(yǔ)言不需要事先編譯，只要有一個(gè)與其相適應(yīng)的解釋器就可以執(zhí)行。腳本語(yǔ)言是指在web瀏覽器內(nèi)有解釋器解釋執(zhí)行的編程語(yǔ)言，每次運(yùn)行程序的時(shí)候，解釋器會(huì)把程序代碼翻譯成可執(zhí)行的格式。4.1.3 JavaScript 的基本特點(diǎn) 2、基于對(duì)象的語(yǔ)言 面向?qū)ο笥腥筇攸c(diǎn)（封裝，繼承，多態(tài)）卻一不可通?！盎趯?duì)象”是使用對(duì)象，但是無(wú)法利用現(xiàn)有的對(duì)象模板產(chǎn)生新的對(duì)象類(lèi)型，也就是說(shuō)“基于對(duì)象”沒(méi)有繼承的特點(diǎn)。沒(méi)有了繼承的概念也就無(wú)從談?wù)摗岸鄳B(tài)”?，F(xiàn)在的很多流行技術(shù)都是基于對(duì)象的，它們使用一些封裝好的對(duì)象，調(diào)用對(duì)象的方法，設(shè)置對(duì)象的屬性。但是它們無(wú)法讓程序員派生新對(duì)象類(lèi)型。他們只能使用

42、現(xiàn)有對(duì)象的方法和屬性。4.1.3 JavaScript 的基本特點(diǎn) 3、簡(jiǎn)單性 它是一種基于Java基本語(yǔ)句和控制流之上的簡(jiǎn)單而緊湊的設(shè)計(jì), 從而對(duì)于學(xué)習(xí)Java是一種非常好的過(guò)渡。它的變量類(lèi)型是采用弱類(lèi)型，并未使用嚴(yán)格的數(shù)據(jù)類(lèi)型。 var a,b,c; a=123; b=“abc”; a=b;4.1.3 JavaScript 的基本特點(diǎn) 4、安全性 JavaScript不能訪問(wèn)本地的硬盤(pán)，不能將數(shù)據(jù)存入到服務(wù)器上，不能對(duì)網(wǎng)絡(luò)文檔進(jìn)行修改和刪除，而只能通過(guò)瀏覽器實(shí)現(xiàn)信息瀏覽或動(dòng)態(tài)交互 5、跨平臺(tái)性JavaScript依賴(lài)于瀏覽器本身，與操作平臺(tái)無(wú)關(guān)，只要計(jì)算機(jī)上安裝了支持JavaScript

43、的瀏覽器（裝有JavaScript解釋器），JavaScript 程序就可以正確執(zhí)行。4.1.3 JavaScript 的基本特點(diǎn) 6、動(dòng)態(tài)性（交互性）JavaScript可以直接對(duì)客戶(hù)輸入在客戶(hù)端做出響應(yīng)，實(shí)現(xiàn)人機(jī)交互，無(wú)須經(jīng)過(guò)Web服務(wù)程序。它對(duì)用戶(hù)的反映響應(yīng)，是采用以事件驅(qū)動(dòng)的方式進(jìn)行的。事件驅(qū)動(dòng)：在網(wǎng)頁(yè)中執(zhí)行了某種操作的動(dòng)作，被稱(chēng)為“事件”(Event)，比如按下鼠標(biāo)、移動(dòng)窗口、選擇菜單等都可以視為事件。當(dāng)事件發(fā)生后，可能會(huì)引起相應(yīng)的事件響應(yīng)。4.1.3 JavaScript 的基本特點(diǎn) JavaScript的局限性各種瀏覽器支持JavaScript的程度是不一樣的，支持和不完全支持J

44、avaScript的 瀏覽器在瀏覽同一個(gè)帶有JavaScript腳本的網(wǎng)頁(yè)時(shí)，效果會(huì)有一定的差距，有時(shí)甚至?xí)@示不出來(lái)。當(dāng)把JavaScript的一個(gè)設(shè)計(jì)目標(biāo)設(shè)定為“Web安全性”時(shí)，就需要犧牲JavaScript的一些功能。這時(shí)，純粹的JavaScript將不能打開(kāi)、讀寫(xiě)和保存用戶(hù)計(jì)算機(jī)上的文件。 它有權(quán)訪問(wèn)的唯一信息就是它所嵌入的那個(gè)Web主頁(yè)中的信息，簡(jiǎn)言之，JavaScript將只存在于它自己的小小世界-Web網(wǎng)頁(yè)里。4.1.4 JavaScript的作用 交互式操作 表單驗(yàn)證 網(wǎng)頁(yè)特效 Web游戲 服務(wù)器腳本開(kāi)發(fā)等4.1.5 其他腳本語(yǔ)言 JScript :Microsoft 公司在

45、Netscape 公司發(fā)布的JavaScript的基礎(chǔ)上，也開(kāi)發(fā)了自己的JavaScript規(guī)范，叫JScript ECMAscript:國(guó)際上通用的標(biāo)準(zhǔn)化版本的JavaScript，是未來(lái)JavaScript的發(fā)展方向 VBScript：Microsoft開(kāi)發(fā)的VB家族的成員，與JavaScript運(yùn)行原理相同。但是，目前只有IE瀏覽器支持VBScript 注意：JavaScript也有服務(wù)器端和客戶(hù)端兩種形式，客戶(hù)端JavaScript就是指把JavaScript解釋器嵌入到web瀏覽器中，這是迄今為止最為普通的JavaScript，一般提到的JavaScript都是指客戶(hù)端JavaScr

46、ipt4.1.6 JavaScript 和Java的區(qū)別 Java是SUN公司推出的新一代面向?qū)ο蟮某绦蛟O(shè)計(jì)語(yǔ)言，特別適合于Internet應(yīng)用程序開(kāi)發(fā)； Java的前身是Oak語(yǔ)言。 JavaScript是Netscape公司的產(chǎn)品，是為了擴(kuò)展Netscape Navigator功能而開(kāi)發(fā)的一種可以嵌入Web頁(yè)面中的基于對(duì)象和事件驅(qū)動(dòng)的解釋性語(yǔ)言，它的前身是Live Script；4.1.6 JavaScript 和Java的區(qū)別 JavaScript是腳本語(yǔ)言，是一種基于對(duì)象（Object Based）和事件驅(qū)動(dòng)（Event Driver）的編程語(yǔ)言。因而它本身提供了非常豐富的內(nèi)部對(duì)象供設(shè)

47、計(jì)人員使用。不支持繼承和多態(tài)。 Java是面向?qū)ο蟮模碕ava是一種真正的面向?qū)ο蟮恼Z(yǔ)言，即使是開(kāi)發(fā)簡(jiǎn)單的程序也必須設(shè)計(jì)對(duì)象。支持封裝、繼承和多態(tài)。 4.1.6 JavaScript 和Java的區(qū)別 JavaScript與Java在瀏覽器中執(zhí)行的方式不一樣。 JavaScript是一種解釋性編程語(yǔ)言，其源代碼在發(fā)往客戶(hù)端執(zhí)行之前不需經(jīng)過(guò)編譯，而是將文本格式的字符代碼發(fā)送給客戶(hù)端，即JavaScript語(yǔ)句本身隨Web頁(yè)面一起下載下來(lái)，由瀏覽器解釋執(zhí)行。 Java的源代碼在傳遞到客戶(hù)端執(zhí)行之前，必須經(jīng)過(guò)編譯，因而客戶(hù)端上須具有相應(yīng)平臺(tái)上的解釋器，傳到客戶(hù)端的是編譯后的字節(jié)碼。4.1.6 Ja

48、vaScript 和Java的區(qū)別 兩種語(yǔ)言所采取的變量是不一樣的。 Java采用強(qiáng)類(lèi)型變量檢查，即所有變量在編譯之前必須聲明為某一指定類(lèi)型。如: int x=1234;String s=“abcd”; JavaScript中是弱類(lèi)型變量。統(tǒng)一采用var聲明，可賦各種數(shù)據(jù)類(lèi)型值。 var a,b,c; a=123; b=“abc”; a=b;4.1.6 JavaScript 和Java的區(qū)別 Java是一種與HTML無(wú)關(guān)的格式，必須通過(guò)像HTML中引用外媒體那么進(jìn)行裝載，其代碼以字節(jié)代碼的形式保存在獨(dú)立的文檔中。在HTML文檔中，Java使用.來(lái)標(biāo)識(shí)。 JavaScript的代碼是一種文本字符

49、格式，可以直接嵌入或間接調(diào)入到HTML文檔中，并且可動(dòng)態(tài)裝載。編寫(xiě)HTML文檔就像編輯文本文件一樣方便。在HTML文檔中，JavaScript使用.來(lái)標(biāo)識(shí)4.1.7 在網(wǎng)頁(yè)中加入JavaScript 在HTML中加入JavaScript代碼，必須將JavaScript代碼放在與標(biāo)簽之間。 / JavaScript語(yǔ)言代碼；JavaScript 語(yǔ)言代碼; . JavaScript中的注釋語(yǔ)句兩種：?jiǎn)涡凶⑨?.與多行注釋/*/。 可以利用HTML注釋語(yǔ)句“”標(biāo)記JavaScript代碼，讓那些老瀏覽器不執(zhí)行這些JavaScript代碼4.1.7 在網(wǎng)頁(yè)中加入JavaScript 一個(gè)HTML文檔

50、中可以出現(xiàn)多個(gè)標(biāo)簽。 JavaScript代碼的出現(xiàn)次序就是JavaScript的執(zhí)行次序。 標(biāo)簽可出現(xiàn)在HTML文檔的任何位置，但一般放在內(nèi)部，可以早于部分執(zhí)行 JavaScript除了可以直接嵌入HTML文件中，也可以獨(dú)立存在與HTML文件之外。可以通過(guò)設(shè)置標(biāo)簽中src屬性來(lái)指定外部JavaScript文件的地址。4.1.8 JavaScript的執(zhí)行方式 1 直接執(zhí)行 在與標(biāo)簽中的JavaScript代碼，只要不是放置在函數(shù)中的，都是屬于直接執(zhí)行的JavaScript代碼。 2 與事件結(jié)合調(diào)用 JavaScript可以支持很多事件，比如說(shuō)單擊鼠標(biāo)左鍵、按下鍵盤(pán)、移動(dòng)鼠標(biāo)等等。與事件結(jié)合，

51、可以調(diào)用執(zhí)行JavaScript的函數(shù)。4.2.1 數(shù)據(jù)類(lèi)型 數(shù)值型：整數(shù)和浮點(diǎn)數(shù)統(tǒng)稱(chēng)為數(shù)值。例如85或3.1415926等。 字符串型：由0個(gè),1個(gè)或多個(gè)字符組成的序列。在JavaScript中，用雙引號(hào)或單引號(hào)括起來(lái)表示，如“您好”、學(xué)習(xí)JavaScript 等。 邏輯（布爾）型：用true或false來(lái)表示。 空（null）值：表示沒(méi)有值，用于定義空的或不存在的引用。要注意，空值不等同于空字符串或0。 未定義（undefined）值：它也是一個(gè)保留字。在兩種情況下可能得到一個(gè)未定義的值，一種是根本不存在的對(duì)象，另一種就是雖然已經(jīng)聲明，但卻沒(méi)有賦值。4.2.1 數(shù)據(jù)類(lèi)型 null是一個(gè)特殊

52、的數(shù)據(jù)類(lèi)型，其所代表的意思為“空”。需要注意，這個(gè)“空”并不代表是0或空字符串。數(shù)字0代表的是數(shù)字，是數(shù)字型的數(shù)據(jù)；空字符串代表的是長(zhǎng)度為0的字符串，是字符串類(lèi)型的數(shù)據(jù)。而null代表沒(méi)有值，不是一個(gè)有效的數(shù)字、字符串，也不是數(shù)組、對(duì)象和函數(shù)，什么數(shù)據(jù)類(lèi)型都不是。 undefined也是一個(gè)特殊的數(shù)據(jù)類(lèi)型，只有定義了一個(gè)變量但沒(méi)有為該變量賦值、使用了一個(gè)并未定義的變量、或者是使用了一個(gè)不存的對(duì)象的屬性時(shí)，JavaScript才會(huì)返回undefined。 除了以上五種基本的數(shù)據(jù)類(lèi)型之外，JavaScript還支持復(fù)合數(shù)據(jù)類(lèi)型，復(fù)合數(shù)據(jù)類(lèi)型包括對(duì)象和數(shù)組兩種。4.2.2 變量 JavaScript

53、中的變量是沒(méi)有類(lèi)型或者說(shuō)是弱類(lèi)型的，這就意味著在JavaScript中的變量可以是任何一種數(shù)據(jù)類(lèi)型。 1變量定義 在JavaScript聲明一個(gè)變量時(shí)，可以使用以下方式實(shí)現(xiàn)： var up,down,left,right; /大小寫(xiě)敏感 也可以直接給它賦值，如下： x=3; 2變量的作用范圍 當(dāng)在一個(gè)函數(shù)之外定義一個(gè)變量，那這個(gè)變量就叫做全局變量。全局變量可用于當(dāng)前所有的文檔。 在函數(shù)內(nèi)部定義的變量則叫做局部變量，它只作用于函數(shù)內(nèi)部。4.2.2 變量 使用變量注意事項(xiàng)： 重復(fù)定義變量：后者覆蓋前者 變量必須要先聲明后使用：否則出錯(cuò)。 給未聲明的變量賦值

54、：可以 引用未賦值的變量：undefined var x; /聲明一個(gè)為賦值的變量，它的值是undefined。 alert(i) ; /使用未聲明的變量將引發(fā)錯(cuò)誤。 d=123; /給未聲明的變量賦值，將創(chuàng)建該變量。4.2.3 常量 1整型常量整型常量 整型常量可以使用十六進(jìn)制、八進(jìn)制和十進(jìn)制表示其值。 2浮點(diǎn)數(shù)常量浮點(diǎn)數(shù)常量 有小數(shù)和指數(shù)兩種表示方式，如3.1415926、-3.1E12、1e12和2E-12。 3字符串常量字符串常量 字符串是由單引號(hào)（）或雙引號(hào)（“）括起來(lái)的字符序 列。其中字符序列的個(gè)數(shù)可以是零個(gè)或多個(gè)。 單引號(hào)所括起 來(lái)的字符序列里可以包括雙引號(hào)，而雙引

55、號(hào)所括起來(lái)的字符序列里也可以包含單引號(hào)。4.2.3 常量 4布爾常量布爾常量 布爾類(lèi)型只有兩種值：true和false。 5數(shù)組常量數(shù)組常量 數(shù)組常量是零或更多表達(dá)式的列表，它包含在一對(duì)方括號(hào)內(nèi)。使用數(shù)組常量來(lái)創(chuàng)建一個(gè)數(shù)組時(shí)，它的元素和長(zhǎng)度由所指定的值進(jìn)行初始化。例如下面常量有3個(gè)元素，其長(zhǎng)度為3。 apple=fruit,China,vitamin 不必在數(shù)組常量中指定所有的元素。如果在一行中輸入兩個(gè)逗號(hào)，它會(huì)自動(dòng)為沒(méi)有指定的元素留出空間，如下例所示： God=Belial,Angel“ 該數(shù)組包含兩個(gè)元素值和一個(gè)空元素，要注意的是，如果把逗號(hào)放到數(shù)組的最后，那它將會(huì)被忽略不計(jì)。4.2.4

56、運(yùn)算符 算術(shù)運(yùn)算符 賦值運(yùn)算符 關(guān)系運(yùn)算符 邏輯運(yùn)算符 位運(yùn)算符 條件運(yùn)算符 其他運(yùn)算符4.2.4 運(yùn)算符var x = 11; var y = 5;with (document) write(x = 11, y = 5); write(x + y 是是 , x + y); write(x - y 是是 , x - y); write(x * y 是是 , x * y); write(x / y 是是 , x / y); write(x % y 是是 , x % y); write(+ x 是是 , + x); write(- y 是是 , - y);4.2.4 運(yùn)算符var x = 5; /

57、x 是數(shù)值是數(shù)值5var y = 5; /y 是字符串是字符串5var z = 6; /x 是數(shù)值是數(shù)值6with (document) write(x = 5, y = 5, z = 6); write(x = y 嗎？嗎？, x = y); write(x = y 嗎？嗎？, x = y); write(x != y 嗎？嗎？, x != y); write(x != y 嗎？嗎？, x != y); write(x = z 嗎？嗎？, x = z); write(y = z 嗎？嗎？, y = z); /類(lèi)型自動(dòng)轉(zhuǎn)換類(lèi)型自動(dòng)轉(zhuǎn)換4.2.4 運(yùn)算符var t = true;var f =

58、false;with(document) write(true & true 的結(jié)果是的結(jié)果是 , t & t);write(true & false 的結(jié)果是的結(jié)果是 , t & f);write(false & true 的結(jié)果是的結(jié)果是 , f & t);write(false & false 的結(jié)果是的結(jié)果是 , f & f);write(true & (1=1) 的結(jié)果是的結(jié)果是 , t & (1=1);write(false & A 的結(jié)果是的結(jié)果是 , f & A);write(A &

59、amp; false 的結(jié)果是的結(jié)果是 , A & f);write(true & A 的結(jié)果是的結(jié)果是 , t & A);write(A & true 的結(jié)果是的結(jié)果是 , A & t);write(A & B 的結(jié)果是的結(jié)果是 , A & B);4.2.5 控制結(jié)構(gòu) if表達(dá)式 Switch while循環(huán) do-while循環(huán) for循環(huán) break continue4.2.6 函數(shù)function JavaScript函數(shù)分為系統(tǒng)函數(shù)和自定義函數(shù) 自定義函數(shù)定義方法function 函數(shù)名(參數(shù)1,參數(shù)2)return 返回值;

60、無(wú)論是否有返回值，都無(wú)需指定返回值類(lèi)型。 JavaScript中可通過(guò)arguments .Length來(lái)檢查參數(shù)的個(gè)數(shù) 在JavaScript中對(duì)象事件的處理通常由函數(shù)(function)擔(dān)任。4.2.6 函數(shù)functionfunction checkPassword(testObject) if (testObject.value.length 4) alert(密碼長(zhǎng)度不得小于四); testObject.focus(); testObject.select();請(qǐng)輸入密碼：4.2.6 函數(shù)functionfunction check()if(document.forms0.elements0.value.length4)alert(密碼長(zhǎng)度小于4); document.forms0.elements0.focus(); document.