電子商務(wù)網(wǎng)站建設(shè)與管理 （第四版）項(xiàng)目二 客戶端交互

掌握電子商務(wù)網(wǎng)站的開發(fā)技術(shù)，掌握工具的使用方法。了解網(wǎng)頁開發(fā)技術(shù)，熟悉使用HTML語言、CSS級聯(lián)樣式表、DOM文檔對象模型及JAVASCRIPT工具完成頁面的客戶端的交互。知識目標(biāo)技能目標(biāo)通過學(xué)習(xí)電子商務(wù)網(wǎng)站的開發(fā)技術(shù)與相應(yīng)工具的使用，完成頁面客戶端的交互。能力目標(biāo)項(xiàng)目二客戶端交互項(xiàng)目二客戶端交互2.1購物車頁面彈出刪除對話框功能2.2“設(shè)為主頁”和“加入收藏”功能。2.1購物車頁面彈出刪除對話框功能一、HTML基礎(chǔ)1．HTML概述超文本標(biāo)記語言（HTML）是網(wǎng)頁制作的基礎(chǔ)，它是網(wǎng)頁開發(fā)中使用的最基本的語言。HTML是一種簡單的、基于問題的語言，它使用一系列代碼語言控制符—標(biāo)記，創(chuàng)建可被瀏覽器解釋的文件，它是一種描述性語言。HTML本質(zhì)上是一個(gè)文本文件，任何文本編輯器都可以編寫。HTML文件從本質(zhì)上來說是文本文件，只不過在其中加入了用以表示格式化和超鏈接的超文本標(biāo)記語言。2.1購物車頁面彈出刪除對話框功能2.HTML的使用（1）字體<hn>...</hn>（2）表格<table>...</table>（3）區(qū)段標(biāo)記<p>...</p>（4）鏈接網(wǎng)絡(luò)鏈接及常用鏈接標(biāo)記（5）設(shè)置圖片（6）滾動條2.1購物車頁面彈出刪除對話框功能二、文檔對象模型DOM1.DOM基本結(jié)構(gòu)2.DOM頂級對象（1）window對象（2）document對象（3）location對象（4）navigator對象（5）history對象（6）frame對象2.2“設(shè)為主頁”和“加入收藏”功能一、JavaScript腳本語言概述JavaScript是由Netscape公司開發(fā)的一種基于對象的網(wǎng)頁腳本編程語言，它支持客戶端和服務(wù)器端應(yīng)用程序的開發(fā)。JavaScript解決了HTML和CSS樣式只能做靜態(tài)網(wǎng)頁的缺陷，將靜態(tài)網(wǎng)頁變成了動態(tài)網(wǎng)頁，使用戶對網(wǎng)頁的操作更加方便。網(wǎng)絡(luò)資料中，常把JavaScript簡稱JS。2.2“設(shè)為主頁”和“加入收藏”功能1.JavaScript語言特點(diǎn)①變量不必聲明類型，但賦值后類型自動確定，也需要轉(zhuǎn)換。②基本數(shù)據(jù)類型、運(yùn)算符、流程控制與C#語言類似。③字符串類型、布爾類型等，對象的初始化等，空值null，與C#語言類似。④自定義函數(shù)無返回值類型聲明。2.2“設(shè)為主頁”和“加入收藏”功能2.JavaScript腳本程序的使用（1）內(nèi)部腳本程序只在一個(gè)頁面中使用的JavaScript程序用、script標(biāo)記包圍，添加到HTML文檔中，可以添加到head部分，也可以添加到body部分。（2）外部腳本程序多個(gè)頁面共用的JavaScript腳本程,<scriptsrc=“xxx.js”…/>將此文件指定給script標(biāo)記的“src”屬性，就可以和使用內(nèi)部腳本一樣使用這個(gè)外部文件中的腳本了。二、JavaScript腳本語言數(shù)據(jù)類型和變量1.數(shù)據(jù)類型2.數(shù)據(jù)類型轉(zhuǎn)換(1)隱式轉(zhuǎn)換

(2)強(qiáng)制轉(zhuǎn)換3.變量2.2“設(shè)為主頁”和“加入收藏”功能2.2“設(shè)為主頁”和“加入收藏”功能三、JavaScript腳本語言運(yùn)算符、表達(dá)式、流程控制1.JavaScript的運(yùn)算符2.JavaScript的流程控制四、JavaScript腳本語言函數(shù)1.全局函數(shù)

eval（字符串）、parseInt（字符串）和parseFloat（字符串）、isNaN（表達(dá)式）、Boolean（對象）、Number（對象）、String（對象）、escape（字符串）和unescape（字符串）。2.2“設(shè)為主頁”和“加入收藏”功能2.自定義函數(shù)（1）函數(shù)定義

function函數(shù)名（var1，var2，…，varN）{代碼…}（2）函數(shù)的調(diào)用

函數(shù)名（參數(shù)列表）；變量名=函數(shù)名（參數(shù)列表）

2.2“設(shè)為主頁”和“加入收藏”功能五、JavaScript腳本語言常用內(nèi)置對象1.字符串對象String除了字符串?dāng)?shù)據(jù)類型，JavaScript還內(nèi)置字符串對象類型，兩者一般混用，其用法和C#的String對象很相似。

2.數(shù)組對象ArrayJavaScript的數(shù)組對象，其屬性和方法與c}}數(shù)組的屬性和方法很類似。2.2“設(shè)為主頁”和“加入收藏”功能3.日期對象DateJavaScript中沒有日期時(shí)間數(shù)據(jù)類型，但有日期對象。4.數(shù)學(xué)對象Math數(shù)學(xué)對象與前面幾種對象不同，它不需要使用new操作符來創(chuàng)建，而可以直接使用Math來調(diào)用數(shù)學(xué)對象，其屬性也就是標(biāo)準(zhǔn)數(shù)學(xué)常量，其方法構(gòu)成了數(shù)學(xué)函數(shù)庫。所有的屬性和方法都是靜態(tài)的，其使用格式為：“Math.屬性”和“Math.方法”。2.2“設(shè)為主頁”和“加入收藏”功能數(shù)學(xué)對象中的方法：（1）min（值1，值2）與max（值l，值2）（2）round（數(shù)值）、ceil（數(shù)值）和floor（數(shù)值）方法。

（3）random（）方法。

（4）sqrt（）方法。

（5）abs（數(shù)值）方法。

除此以外，Ja