Javascript程序設(shè)計(jì) 課程標(biāo)準(zhǔn)、授課計(jì)劃

PAGEPAGE3《Javascript程序設(shè)計(jì)》課程標(biāo)準(zhǔn)課程編碼：課程類型：理論+實(shí)踐課程性質(zhì)：必修課適用專業(yè)：學(xué)時(shí)：64學(xué)時(shí)學(xué)分：3.5學(xué)分課程負(fù)責(zé)人：參編人員：一、課程定位（一）課程性質(zhì)《Javascript程序設(shè)計(jì)》是一門需要綜合應(yīng)用所學(xué)網(wǎng)頁制作知識(HTML、CSS、JavaScript)的課程而打造的面向網(wǎng)頁制作方向就業(yè)技能的一門重要課程。該課程深入淺出，結(jié)合實(shí)際案例系統(tǒng)地講解了使用JavaScript和jQuery設(shè)計(jì)動(dòng)態(tài)網(wǎng)頁的知識和技巧，它定位于WEB技術(shù)開發(fā)，是WEB前端技術(shù)開發(fā)的必備課程，在學(xué)習(xí)了html+css網(wǎng)頁設(shè)計(jì)基礎(chǔ)、編程基礎(chǔ)、網(wǎng)頁美工的基礎(chǔ)下，為HTML5移動(dòng)web開發(fā)技術(shù)、php框架開發(fā)技術(shù)、javaweb開發(fā)技術(shù)等課程的學(xué)習(xí)打下基礎(chǔ)，在整個(gè)課程體系中具有承前啟后的重要作用。（二）課程作用《Javascript程序設(shè)計(jì)》課程任務(wù)是培養(yǎng)網(wǎng)頁設(shè)計(jì)、網(wǎng)頁美工以及WEB綜合開發(fā)的初、中級專業(yè)人才，通過本課程的學(xué)習(xí)，學(xué)生能掌握J(rèn)avaScript語言的基本編程思想，并能熟練利用JavaScript控制WEB頁面各級元素，實(shí)現(xiàn)HTML5移動(dòng)web開發(fā)技術(shù)、php框架開發(fā)技術(shù)、javaweb開發(fā)技術(shù)等任務(wù)。（三）前導(dǎo)、后續(xù)課程它是WEB前端技術(shù)開發(fā)的必備課程，在整個(gè)課程體系中具有重要的作用。本課程的前導(dǎo)課程：html+css網(wǎng)頁設(shè)計(jì)基礎(chǔ)、編程基礎(chǔ)、網(wǎng)頁美工。后續(xù)課程：網(wǎng)頁美工、PHP動(dòng)態(tài)網(wǎng)頁設(shè)計(jì)、C#程序設(shè)計(jì)與應(yīng)用等。二、課程設(shè)計(jì)思路通過本課程的學(xué)習(xí)，使學(xué)生對HTML腳本、CSS代碼和JavaScript特效代碼等網(wǎng)頁基本組成元素有全面和充分的認(rèn)識，能熟練地使用以上代碼開發(fā)出漂亮的靜態(tài)網(wǎng)頁，制作出炫酷的網(wǎng)頁效果，并為后繼的動(dòng)態(tài)網(wǎng)頁課程的學(xué)習(xí)打好基礎(chǔ)。使得學(xué)生能掌握J(rèn)avaScript語言的基本編程思想，并能熟練利用JavaScript控制WEB頁面各級元素，實(shí)現(xiàn)WEB前端的驗(yàn)證、動(dòng)態(tài)展示等任務(wù)。主要包括JavaScript的基礎(chǔ)語法，常用開發(fā)工具和調(diào)試工具，簡單的CSS知識，DOM模型及事件機(jī)制和常見事件處理等內(nèi)容。針對學(xué)生的層次和高職學(xué)生的特點(diǎn)，在本課程的日常教學(xué)中努力做到理論教學(xué)以應(yīng)用為目的，以必需、夠用為度，專業(yè)教學(xué)加強(qiáng)針對性和應(yīng)用性。以職業(yè)能力培養(yǎng)為主線，使教學(xué)內(nèi)容按照能力培養(yǎng)目標(biāo)進(jìn)行重組、整合與優(yōu)化，教學(xué)方法體現(xiàn)能力培養(yǎng)，廣泛采用“案例”、“參與式”、“討論式”、“啟發(fā)式”等生動(dòng)活潑的教學(xué)形式，有效利用現(xiàn)代教育技術(shù)組織教學(xué)，并加強(qiáng)課程的組織管理、運(yùn)行管理和質(zhì)量管理以及課程的過程評價(jià)與目標(biāo)評價(jià)。具體措施體現(xiàn)在以下幾個(gè)方面：?基于典型工作過程分析，構(gòu)建課程體系；?職業(yè)能力培養(yǎng)為核心，設(shè)計(jì)教學(xué)內(nèi)容；?以提高學(xué)生職業(yè)能力和職業(yè)素養(yǎng)為目標(biāo)，重視實(shí)踐教學(xué)；?融合職業(yè)資格標(biāo)準(zhǔn)，推行雙證書制；?校企合作，共建新型實(shí)踐教學(xué)基地；?校企合作，形成實(shí)踐技能課主要由企業(yè)兼職教師講授的機(jī)制。三、課程目標(biāo)通過本課程的學(xué)習(xí)，使學(xué)生形成一定的學(xué)習(xí)能力、溝通與團(tuán)隊(duì)的協(xié)作能力，形成良好的思考問題、分析問題和解決問題的能力，養(yǎng)成良好的職業(yè)素養(yǎng)。遵守國家關(guān)于軟件與信息技術(shù)的相關(guān)法律法規(guī)，形成關(guān)鍵性的軟件開發(fā)與應(yīng)用的能力。最終成為具備較全面的軟件開發(fā)與信息服務(wù)的技術(shù)人才。根據(jù)高職教育的特點(diǎn)，按照學(xué)院“小學(xué)校、大課堂”的辦學(xué)思路和“校企融合、同興共贏”的辦學(xué)模式，積極探索“校企合作、工學(xué)結(jié)合”的人才培養(yǎng)模式，積極探索以實(shí)踐能力考核為主的課程評價(jià)方法，切實(shí)提高學(xué)生的職業(yè)能力和就業(yè)競爭力。

總體設(shè)計(jì)思路是：以高職高專的教育規(guī)律為基礎(chǔ)，結(jié)合本校的教學(xué)要求，跟蹤當(dāng)前網(wǎng)頁設(shè)計(jì)發(fā)展的趨勢，做到教學(xué)與實(shí)踐結(jié)合。通過若干項(xiàng)目任務(wù)的分解學(xué)習(xí)，達(dá)到課程學(xué)習(xí)的要求。（一）能力目標(biāo)形成一定的學(xué)習(xí)能力、溝通與團(tuán)隊(duì)的協(xié)作能力；形成良好的思考問題、分析問題和解決問題的能力，養(yǎng)成良好的職業(yè)素養(yǎng)；遵守國家關(guān)于軟件與信息技術(shù)的相關(guān)法律法規(guī)，形成關(guān)鍵性的軟件開發(fā)與應(yīng)用的能力。（二）知識目標(biāo)掌握J(rèn)avaScript語言的基本語法；掌握BOM對象的常用屬性和方法；掌握文檔對象的常用屬性和方法；掌握DOM的概念以及利用DOM操作文檔節(jié)點(diǎn)的方法；掌握簡單的CSS知識；掌握常用開發(fā)工具和調(diào)試工具。（三）素質(zhì)目標(biāo)形成一定的學(xué)習(xí)能力、溝通與團(tuán)隊(duì)的協(xié)作能力；能用心尊重他人、不斷激勵(lì)自己；樂于團(tuán)隊(duì)合作、善于整合資源；善于表達(dá)溝通、用于企業(yè)實(shí)踐、注重學(xué)以致用；及時(shí)適應(yīng)環(huán)境變化、不斷開拓創(chuàng)新。四、課程內(nèi)容與安排根據(jù)專業(yè)課程目標(biāo)和涵蓋的工作任務(wù)要求，確定課程內(nèi)容和要求，說明學(xué)生應(yīng)獲得的知識、技能與態(tài)度。本課程的主要任務(wù)是培養(yǎng)網(wǎng)頁設(shè)計(jì)、網(wǎng)頁美工以及WEB綜合開發(fā)的初、中級專業(yè)人才。學(xué)生能掌握J(rèn)avaScript語言的基本編程思想，并能熟練利用JavaScript控制WEB頁面各級元素，實(shí)現(xiàn)WEB前端的驗(yàn)證、動(dòng)態(tài)展示等任務(wù)。本課程主要講解的相關(guān)知識有：掌握J(rèn)avaScript語言的基本語法，BOM對象的常用屬性和方法，文檔對象的常用屬性和方法，DOM的概念以及利用DOM操作文檔節(jié)點(diǎn)的方法，簡單的CSS知識，掌握常用開發(fā)工具和調(diào)試工具。最后以一個(gè)綜合的實(shí)例將這些技術(shù)集成在一起，實(shí)現(xiàn)了一個(gè)完整的簡單的，具有人機(jī)交互功能的動(dòng)態(tài)網(wǎng)頁的設(shè)計(jì)。具體安排見下表所示：周次學(xué)習(xí)情境/項(xiàng)目/單元（選其一）子情境/子項(xiàng)目/子單元（選其一）學(xué)習(xí)內(nèi)容（支撐知識）教學(xué)方法及手段成果形式參考學(xué)時(shí)第1周JavaScript概述1.JavaScript的起源2.瀏覽器之爭3.Javascript的實(shí)現(xiàn)4．Javascript小體驗(yàn)JavaScript的起源及實(shí)現(xiàn)案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法JavaScript環(huán)境搭建2JavaScript案例演示搭建JavaScript開發(fā)環(huán)境第1-4周JavaScript基礎(chǔ)1.JavaScript語法2.變量、數(shù)據(jù)類型、關(guān)鍵字、保留字、條件語句、循環(huán)語句、函數(shù)、對象、bom基礎(chǔ)JavaScript類型案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法輸入數(shù)字判斷程序網(wǎng)頁12JavaScript變量與關(guān)鍵字條件語句打印三角形循環(huán)語句函數(shù)注冊判斷函數(shù)網(wǎng)頁對象BOM基礎(chǔ)第4-5周JavaScript開發(fā)1.JavaScript應(yīng)用環(huán)境2.常用開發(fā)工具3.常用調(diào)試工具常用開發(fā)工具介紹案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法簡易計(jì)算器4常用調(diào)試工具介紹第5-7周CSS基礎(chǔ)1.css的概念2.網(wǎng)頁設(shè)計(jì)中的css3.使用css控制頁面4.css選擇器5.css設(shè)置文字效果CSS的使用樣式案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法文字環(huán)繞圖片效果8CSS選擇器鏈接文字樣式設(shè)定網(wǎng)頁CSS文字與圖片效果第7-9周CSS進(jìn)階1.DIV和SPAN標(biāo)記布局網(wǎng)頁2.CSS布局定位3.盒子浮動(dòng)和定位DIV和SPAN標(biāo)記布局網(wǎng)頁案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法盒模型的應(yīng)用8第9-11周DOM模型1.DOM及DOM技術(shù)簡介2.網(wǎng)頁中的DOM模型框架3、DOM模型中的節(jié)點(diǎn)4.使用非標(biāo)準(zhǔn)DOMinnerHTML屬性DOM技術(shù)簡介案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法動(dòng)態(tài)修改頁面圖片8網(wǎng)頁中的DOM模型框架元素節(jié)點(diǎn)、文本節(jié)點(diǎn)、屬性節(jié)點(diǎn)檢查瀏覽器支持的DOM標(biāo)準(zhǔn)級別DOM與CSS第11-12周JavaScript高級篇1.事件機(jī)制簡介2.常用事件函數(shù)事件機(jī)制簡介案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法屏蔽鼠標(biāo)右鍵網(wǎng)頁伸縮的兩級菜單網(wǎng)頁4常用事件函數(shù)第12-14周表格與表單1.cs控制表格樣式2.DOM動(dòng)態(tài)控制表格3.控制表單以及表單元素的使用使用CSS控制表格樣式案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法自動(dòng)提示的文本框8使用DOM動(dòng)態(tài)控制表格用JavaScript控制多次提交網(wǎng)頁控制表單第14-15周JavaScript設(shè)計(jì)與優(yōu)化1．常見錯(cuò)誤和異常2.錯(cuò)誤處理3.使用調(diào)試器4.JavaScript優(yōu)化常見錯(cuò)誤和異常案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法通過try…catch逐漸縮小范圍查找錯(cuò)誤其他設(shè)計(jì)常用注意事項(xiàng)6錯(cuò)誤處理使用調(diào)試器JavaScript優(yōu)化Ajax異步交互3.Aja框架2.jQuery的$3.jQuery與CSS34.jQuery開發(fā)和調(diào)試工具2.直接獲取、編輯內(nèi)容3.處理表單元素的值4.處理頁面事件2.元素顯隱的漸入漸出效果3.幻燈片效果第16周復(fù)習(xí)4總結(jié)64五、課程考核評價(jià) （一）教學(xué)方法和教學(xué)手段結(jié)合軟件與信息服務(wù)專業(yè)學(xué)生特點(diǎn)，基于行動(dòng)導(dǎo)向，根據(jù)每個(gè)任務(wù)的內(nèi)容特點(diǎn)，以真實(shí)項(xiàng)目進(jìn)行引導(dǎo)開展教學(xué)。整個(gè)課程以項(xiàng)目任務(wù)實(shí)訓(xùn)為主線，以技能培養(yǎng)為核心來組織教學(xué)。學(xué)生在完成項(xiàng)目分解的任務(wù)中學(xué)習(xí)相關(guān)知識，并利用這些知識解決項(xiàng)目中的問題。（1）項(xiàng)目教學(xué)法課程將WEB前端開發(fā)中的某個(gè)應(yīng)用作為一個(gè)項(xiàng)目，并分解為多個(gè)小的任務(wù)。每個(gè)任務(wù)的學(xué)習(xí)過程以工作過程為導(dǎo)向，最終形成學(xué)生的職業(yè)行動(dòng)能力。（2）小組教學(xué)法以6人為一個(gè)單位，成立教學(xué)小組。單人完成的項(xiàng)目，組內(nèi)可以互相學(xué)習(xí)，督促和評價(jià)。大型復(fù)雜的項(xiàng)目，小組成員共同完成。（3）視頻展示法教師對講授內(nèi)容充分提煉，將復(fù)雜的操作錄制下來，方便學(xué)生反復(fù)觀看和模仿，形象生動(dòng)的動(dòng)態(tài)展示和講解。使抽象、難懂的教學(xué)內(nèi)容變得直觀、易懂和容易掌握；提高了教學(xué)效率；便于學(xué)生自主學(xué)習(xí)。（二）教學(xué)手段（1）充分利用多媒體實(shí)訓(xùn)室和多媒體課件本課程的課堂講授全部在實(shí)訓(xùn)室進(jìn)行，便于使用投影設(shè)備，采用多媒體教學(xué)手段。開發(fā)和使用的多媒體課件制作精美并含有動(dòng)態(tài)演示，其有效地增強(qiáng)了學(xué)生的學(xué)習(xí)興趣。（2）鼓勵(lì)自主學(xué)習(xí)制作網(wǎng)絡(luò)課件，并將教學(xué)大綱、教案、習(xí)題等同時(shí)上網(wǎng)開放，激發(fā)學(xué)生學(xué)習(xí)興趣，鼓勵(lì)學(xué)生自主學(xué)習(xí)，同時(shí)可以緩解課程信息量增加與壓縮授課學(xué)時(shí)之間的矛盾。（3）嚴(yán)格考評制度設(shè)計(jì)了內(nèi)容豐富、形式多樣的習(xí)題作業(yè)，以利于學(xué)生理解和掌握所學(xué)知識。嚴(yán)格檢查平時(shí)作業(yè)完成情況，及時(shí)反饋?zhàn)鳂I(yè)中反映的問題。采用定期模擬考試的方法及時(shí)檢驗(yàn)學(xué)生階段性學(xué)習(xí)成果。建立科學(xué)合理的考核評價(jià)制度，以促進(jìn)學(xué)生的學(xué)習(xí)積極性和自我學(xué)習(xí)的動(dòng)力。（4）充分利用網(wǎng)絡(luò)環(huán)境和資源充分利用互聯(lián)網(wǎng)資源、本課程網(wǎng)站資源，在網(wǎng)上開展教學(xué)活動(dòng)，包括網(wǎng)絡(luò)課程學(xué)習(xí)、自主學(xué)習(xí)、課后復(fù)習(xí)、課件下載、作業(yè)提交、專題討論、網(wǎng)上答疑等，使學(xué)生可以不受時(shí)間、地點(diǎn)的限制，方便地進(jìn)行學(xué)習(xí)。（二）教學(xué)評價(jià)本課程實(shí)施綜合考評，注重考核學(xué)生掌握技能的水平，同時(shí)注重學(xué)習(xí)態(tài)度和最終成績的關(guān)聯(lián)，以全面綜合地評定學(xué)生的能力。（1）平時(shí)技能考核：布置課堂作業(yè)以及拓展實(shí)訓(xùn)項(xiàng)目，使學(xué)生能獨(dú)立完成大部分的技能訓(xùn)練，小項(xiàng)目及活動(dòng)的技能，均以個(gè)人為考核單位，在平時(shí)考核和記錄。成績包括學(xué)習(xí)態(tài)度及項(xiàng)目技能完成情況。（2）期末考試采取開卷方式，試卷根據(jù)本課程的教學(xué)要求，并結(jié)合教學(xué)實(shí)際進(jìn)行設(shè)計(jì)。（3）按平時(shí)成績占40%、期末成績占60%的標(biāo)準(zhǔn)給出總評成績。六、課程資源開發(fā)與利用（一）選用教材： 校本教材《Javascript程序設(shè)計(jì)》主編：孫永林電子科技大學(xué)出版社2019年8月（二）教學(xué)參考書：[1]陳承歡.JavaScript+jQuery網(wǎng)頁特效設(shè)計(jì)實(shí)例教程[M].人民郵電出版社,2013[2]劉增杰.精通HTML5+CSS3+JavaScript網(wǎng)頁設(shè)計(jì)[M].清華大學(xué)出版社,2012[3]WesleyHales.HTML5和JavaScriptWeb應(yīng)用開發(fā)[M].人民郵電出版社,2013（三）其它資源 1．/2．設(shè)計(jì)師的網(wǎng)上家園/3．開源中國

/七、課程實(shí)施建議（一）師資條件建議 擔(dān)任本課程的主講教師需要熟練掌握網(wǎng)頁設(shè)計(jì)相關(guān)專業(yè)知識，具有敏銳的網(wǎng)站設(shè)計(jì)發(fā)展趨勢眼光，同時(shí)應(yīng)具備較豐富的教學(xué)經(jīng)驗(yàn)。在教學(xué)組織能力方面，本課程的主講教師應(yīng)具備基本的設(shè)計(jì)能力，即根據(jù)本課程標(biāo)準(zhǔn)制定詳細(xì)的授課計(jì)劃，對每一堂課的教學(xué)過程精心設(shè)計(jì)；還應(yīng)具備較強(qiáng)的施教能力、課堂掌控能力和應(yīng)變能力。（二）校內(nèi)外實(shí)訓(xùn)環(huán)境建議 承擔(dān)本課程教學(xué)的兼職教師應(yīng)具備中、高級職稱，主要承擔(dān)動(dòng)態(tài)網(wǎng)頁開發(fā)技術(shù)JavaScript應(yīng)用模塊、網(wǎng)絡(luò)服務(wù)器管理技術(shù)模塊的教學(xué)，另外，本門課程的實(shí)訓(xùn)條件要求有教學(xué)做一體化的綜合實(shí)訓(xùn)室，融教學(xué)與實(shí)訓(xùn)為一體，以及與課程相應(yīng)的軟件作支持。校外要求有與學(xué)校長期合作的企業(yè)做實(shí)訓(xùn)基地，滿足學(xué)生頂崗實(shí)習(xí)的需要。課程名稱:Javascript程序設(shè)計(jì)課程編碼:開課單位:制定人:審核人:制定時(shí)間:2021年8月20日二○二一——二○二二學(xué)年度第一學(xué)期課程名稱：Javascript程序設(shè)計(jì) 學(xué)時(shí)：64周次學(xué)習(xí)情境/項(xiàng)目/單元（選其一）子情境/子項(xiàng)目/子單元（選其一）學(xué)習(xí)內(nèi)容（支撐知識）教學(xué)方法及手段成果形式參考學(xué)時(shí)第1周JavaScript概述1.JavaScript的起源2.瀏覽器之爭3.Javascript的實(shí)現(xiàn)4．Javascript小體驗(yàn)JavaScript的起源及實(shí)現(xiàn)案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法JavaScript環(huán)境搭建2JavaScript案例演示搭建JavaScript開發(fā)環(huán)境第1-4周JavaScript基礎(chǔ)1.JavaScript語法2.變量、數(shù)據(jù)類型、關(guān)鍵字、保留字、條件語句、循環(huán)語句、函數(shù)、對象、bom基礎(chǔ)JavaScript類型案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法輸入數(shù)字判斷程序網(wǎng)頁12JavaScript變量與關(guān)鍵字條件語句打印三角形循環(huán)語句函數(shù)注冊判斷函數(shù)網(wǎng)頁對象BOM基礎(chǔ)第4-5周JavaScript開發(fā)1.JavaScript應(yīng)用環(huán)境2.常用開發(fā)工具3.常用調(diào)試工具常用開發(fā)工具介紹案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法簡易計(jì)算器4常用調(diào)試工具介紹第5-7周CSS基礎(chǔ)1.css的概念2.網(wǎng)頁設(shè)計(jì)中的css3.使用css控制頁面4.css選擇器5.css設(shè)置文字效果CSS的使用樣式案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、講授法文字環(huán)繞圖片效果8CSS選擇器鏈接文字樣式設(shè)定網(wǎng)頁CSS文字與圖片效果第7-9周CSS進(jìn)階1.DIV和SPAN標(biāo)記布局網(wǎng)頁2.CSS布局定位3.盒子浮動(dòng)和定位DIV和SPAN標(biāo)記布局網(wǎng)頁案例教學(xué)法、項(xiàng)目教學(xué)法、任務(wù)驅(qū)動(dòng)教學(xué)法、