“Javascript Web開發(fā)與應(yīng)用”課程網(wǎng)絡(luò)教學(xué)研究與探索

范開濤+甕南

摘要：“Javascript Web開發(fā)與應(yīng)用”是Web設(shè)計系列課程中一門重要的技術(shù)課，該課程需要html知識、css知識和高級語言程序設(shè)計知識，具有很強的實踐性。該文通過分析目前Javascript程序設(shè)計課程的現(xiàn)狀，提出了利用昆明理工大學(xué)“教育在線”這個計算機(jī)網(wǎng)絡(luò)教育平臺，合理規(guī)劃教學(xué)內(nèi)容，積累教育資源，跨地域開展教學(xué)互動，進(jìn)行教學(xué)評價，構(gòu)建快捷高效的師生互動課堂。實踐表明，這種教學(xué)形式能有效提高教學(xué)效率和效果。

關(guān)鍵詞：Javascript；Web；開發(fā)；應(yīng)用；教學(xué)；改革；研究

中圖分類號：TP3 文獻(xiàn)標(biāo)識碼：A 文章編號：1009-3044（2014）16-3832-05

Abstract： “Web development and application with javascript” is an important technology course in web design courses. The course needs HTML knowledge， knowledge of CSS and advanced language program design knowledge， is practical. In this paper， through the analysis of the current status of javascript development course， by using the computer network education platform - “eol.kmust.edu.cn” of Kunming University of Science and Technology， we can make plan of the teaching content， accumulate educational resources， teach and evaluate cross regions， build efficient teacher-student interactions. Practice shows that， this kind of teaching can effectively improve teaching efficiency and effect.

Key words： javascript； web； development； application； teaching； reform； research

1 概述

JavaScript是一種由Netscape的LiveScript發(fā)展而來的原型化繼承的面向?qū)ο蟮膭討B(tài)類型的區(qū)分大小寫的客戶端腳本語言，主要目的是為了解決服務(wù)器端語言（比如Perl）遺留的速度問題，為客戶提供更流暢的瀏覽效果。JavaScript使用一些智能的語法和語義來仿真高度復(fù)雜的行為，其對象模型極為靈活、開放和強大，具有全部的反射性。“Javascript Web開發(fā)與應(yīng)用”是研究如何利用這些腳本編程技術(shù)讓網(wǎng)頁具有更加人性化的界面和絢麗多彩的特殊動態(tài)效果的一門學(xué)科，是計算機(jī)科學(xué)技術(shù)領(lǐng)域中發(fā)展比較活躍、應(yīng)用比較廣泛的一個分支。

2 Javascript課程現(xiàn)狀分析

在高校計算機(jī)教育的課程設(shè)置體系中，Javascript程序設(shè)計課程是網(wǎng)絡(luò)設(shè)計與制作的延續(xù)性課程。目前大多數(shù)高等學(xué)校本科生培養(yǎng)方案中，Javascript程序設(shè)計沒有單獨設(shè)置課程，統(tǒng)一設(shè)置“網(wǎng)絡(luò)設(shè)計與制作”一門課程，其中包括html、css、javascript三大部分內(nèi)容，由于課時原因，通常javascript部分都作為自學(xué)內(nèi)容而不納入考核范圍，導(dǎo)致很多學(xué)生都缺乏這方面的知識，難以適應(yīng)計算機(jī)的飛速發(fā)展。

目前也有高校單獨開設(shè)Javascript程序設(shè)計課程，采用“案例教學(xué)法”在教授方式改革，引入“項目管理過程”進(jìn)行考核方式創(chuàng)新[1]。學(xué)生在正式學(xué)習(xí)前，先學(xué)習(xí)網(wǎng)頁制作等知識，再學(xué)習(xí)Javascript基礎(chǔ)知識和高級引用，了解最流行的設(shè)計技術(shù)。這種方式的優(yōu)點是可以充分激發(fā)學(xué)生的學(xué)習(xí)興趣，有助于提高學(xué)生的動手能力，缺點是在傳統(tǒng)課堂中，因課時原因，難以銜接好前置課程與Javascript課程，進(jìn)行充分融合[2]。

3 我校Javascript課程的改革

Javascript程序設(shè)計目的是優(yōu)化與改進(jìn)網(wǎng)頁設(shè)計，讓web頁面具有更加流暢的人性化交互界面。學(xué)生要掌握J(rèn)avascript技術(shù)，需要了解并掌握web基本概念原理、html設(shè)計知識、css設(shè)計知識、c語言函數(shù)式設(shè)計知識、面向?qū)ο蟪绦蛟O(shè)計知識，并且能夠融會貫通。

教師是教學(xué)過程的引導(dǎo)者和參與者[3]。教師的教學(xué)過程不能簡單地羅列知識點，而要注重培養(yǎng)學(xué)生的思維能力、創(chuàng)新能力、實踐能力。針對因課時不足而導(dǎo)致課程間難以銜接的問題，我校計算中心從2013年開始，面向全校開設(shè)“Javascript Web開發(fā)與應(yīng)用”課程。利用“教育在線”公共網(wǎng)絡(luò)教學(xué)平臺，參照計算機(jī)類本科生培養(yǎng)方案，結(jié)合非計算機(jī)本科生的特點，調(diào)整了Javascript課程的教學(xué)內(nèi)容，采用傳統(tǒng)課堂與網(wǎng)絡(luò)課堂混合的模式開展教學(xué)。

3.1 課程內(nèi)容設(shè)置

課程內(nèi)容調(diào)整為以Javascript為主，web其他知識為輔的結(jié)構(gòu)，設(shè)置2個學(xué)分， 32講授學(xué)時。課程教材內(nèi)容各章設(shè)置如表1“課程大綱”，共分為四部分，第一部分是基礎(chǔ)知識部分，主要目的是讓學(xué)生認(rèn)識Web的基本概念原理，如何用HTML語言表示網(wǎng)頁內(nèi)容，如何用CSS標(biāo)準(zhǔn)修飾網(wǎng)頁；第二部分是Javascript語言主干知識部分，主要目的是讓學(xué)生了解Javascript的內(nèi)涵，掌握MCMAScript的程序設(shè)計方法，如何操縱瀏覽器對象和文檔對象；第三部分是Javascript語言選修知識部分，主要目的是讓學(xué)生掌握如何與服務(wù)器交換數(shù)據(jù)，如何實踐高級應(yīng)用；第四部分是參考附錄，主要目的是拖寬學(xué)生視野，讓學(xué)生了解Javascript的前沿技術(shù)與應(yīng)用。endprint

（2）實踐經(jīng)驗與應(yīng)用。

（3）高級設(shè)計技巧與應(yīng)用。

課程實驗內(nèi)容采用eclipse平臺作為主要的學(xué)習(xí)、實驗平臺，減少商業(yè)軟件對學(xué)生的影響，避免形成固定的思維模式。Eclipse 是一個開放源代碼的、基于Java的可擴(kuò)展開發(fā)平臺，支持Windows、Linux、Mac等多種操作系統(tǒng)。Eclipse 可以當(dāng)作 C/C++、COBOL、Java 、PHP、Javascript等多種語言的IDE來使用。Eclipse的最大特點是跨平臺、開源免費和優(yōu)秀的插件框架，學(xué)生在熟悉或掌握了它的用法后還可以自定義新的插件，不斷地改進(jìn)實驗的軟件裝置環(huán)境，提高實驗效率和水平。

課程實驗內(nèi)容設(shè)置如表2“課程實驗項目”，共分為驗證型、綜合型、創(chuàng)新型三類實驗。驗證型實驗主要目的是讓學(xué)生對各章節(jié)的離散知識點進(jìn)行驗證，鞏固所學(xué)概念與原理等知識。綜合型實驗主要目的是讓學(xué)生學(xué)會融會貫通，運用所學(xué)知識，綜合訓(xùn)練學(xué)生的實驗技能與方法，完成有實際意義并且具備一定工程量的綜合型網(wǎng)頁站點或開發(fā)項目。創(chuàng)新型實驗主要目的是讓部分優(yōu)秀學(xué)生運用所學(xué)知識，進(jìn)行主動探索與研究，發(fā)現(xiàn)并解決問題，開展例如“javascript語言發(fā)展”、“javascript交叉學(xué)科應(yīng)用”、“參與google競賽”等方向自選題目的科學(xué)技術(shù)研究訓(xùn)練，提高學(xué)生的學(xué)術(shù)研究水平和能力，提高學(xué)生的動手實踐能力。

3.2 課程教學(xué)模式

課程教學(xué)模式采用基于自主學(xué)習(xí)的網(wǎng)絡(luò)化分級教學(xué)模式。由于目前課程建設(shè)還沒有得到普遍認(rèn)可，學(xué)分和學(xué)時數(shù)都比較低，所以用32學(xué)時進(jìn)行課程的主干核心知識講授與引導(dǎo)，其他部分由學(xué)生課后自學(xué)，由主講教師利用“教育在線”網(wǎng)絡(luò)教學(xué)平臺，發(fā)布通知消息、收發(fā)郵件、規(guī)劃教學(xué)日歷、記錄教學(xué)筆記、收發(fā)作業(yè)、共享教學(xué)資源、開展問卷調(diào)查、答疑交流等教學(xué)活動。這樣利用計算機(jī)網(wǎng)絡(luò)實施教學(xué)的好處是既培養(yǎng)了學(xué)生的自主學(xué)習(xí)能力、獨立思考能力，又拓展了教學(xué)場地和教學(xué)時間的限制，有效地為教學(xué)改革鋪設(shè)了良好的基礎(chǔ)。

本課程由于面向全校學(xué)生開放，所以面臨學(xué)生基礎(chǔ)復(fù)雜的問題，表現(xiàn)在“基礎(chǔ)知識掌握程度差異大”、“專業(yè)方向差異大”、“年級跨度大”等方面。為了解決這一難題，課題組計劃采用分級教學(xué)模式，按照學(xué)生的基礎(chǔ)知識掌握程度和專業(yè)方向等維度，進(jìn)行分級并開展教學(xué)。具體的分級原則如表3“學(xué)生分級原則”。

為了保證教育的公平性與公正性，結(jié)合昆明理工大學(xué)生源的具體特點，對各個級別組的學(xué)生的學(xué)習(xí)評價指標(biāo)與方法也做出了大膽的嘗試改革。本課程的評價方式表現(xiàn)為平時簽到成績、理論試題測試（包括Web知識、HTML知識、CSS知識、Javascript等章節(jié)知識）、綜合設(shè)計成績、創(chuàng)新研究成績。其中簽到共10次，根據(jù)簽到次數(shù)計算平時簽到成績，滿分100分；理論試題由“教育在線”根據(jù)主講教師設(shè)計試題庫隨機(jī)抽題組卷，滿分100分；綜合設(shè)計一項，學(xué)生任選，滿分100分；創(chuàng)新性研究一項，學(xué)生任選，滿分100分。具體的評價要求如表4“學(xué)生分級評價”。

4 結(jié)束語

經(jīng)過一年的“Javascript Web開發(fā)與應(yīng)用”教學(xué)經(jīng)驗表明，這種教學(xué)改革能夠明顯提高普通學(xué)生的計算機(jī)素養(yǎng)與分析解決問題的能力，能夠提高優(yōu)秀學(xué)生的創(chuàng)新能力和研究能力，對Javascript類課程教學(xué)和大學(xué)生人才培養(yǎng)模式具有一定的參考價值?！癑avascript Web開發(fā)與應(yīng)用”課程教學(xué)改革是一個長期的過程，我們將結(jié)合前沿成果和技術(shù)，繼續(xù)思考改革的方向。

參考文獻(xiàn)：

[1] 王鶴琴，尹向兵. Javascript教學(xué)方法淺析[J].電腦知識與技術(shù)，2010，6（5）：1146-1147.

[2] 柯琦.Javascript程序設(shè)計基礎(chǔ)課程教學(xué)淺析[J].信息技術(shù)，2013（5）：239-240.

[3] 何志永.Javascript課程教學(xué)優(yōu)化研究[J].教育與職業(yè)，2013（2）：140-141.

[4] 袁國武，徐丹，趙楊. “計算機(jī)圖形學(xué)”實驗課程改革經(jīng)驗與探索[J].計算機(jī)教育，2009（15）：29-32.

[5] 阮文江.Javascript程序設(shè)計基礎(chǔ)教程[M].北京：人民郵電出版社，2010.endprint

（2）實踐經(jīng)驗與應(yīng)用。

（3）高級設(shè)計技巧與應(yīng)用。

課程實驗內(nèi)容采用eclipse平臺作為主要的學(xué)習(xí)、實驗平臺，減少商業(yè)軟件對學(xué)生的影響，避免形成固定的思維模式。Eclipse 是一個開放源代碼的、基于Java的可擴(kuò)展開發(fā)平臺，支持Windows、Linux、Mac等多種操作系統(tǒng)。Eclipse 可以當(dāng)作 C/C++、COBOL、Java 、PHP、Javascript等多種語言的IDE來使用。Eclipse的最大特點是跨平臺、開源免費和優(yōu)秀的插件框架，學(xué)生在熟悉或掌握了它的用法后還可以自定義新的插件，不斷地改進(jìn)實驗的軟件裝置環(huán)境，提高實驗效率和水平。

課程實驗內(nèi)容設(shè)置如表2“課程實驗項目”，共分為驗證型、綜合型、創(chuàng)新型三類實驗。驗證型實驗主要目的是讓學(xué)生對各章節(jié)的離散知識點進(jìn)行驗證，鞏固所學(xué)概念與原理等知識。綜合型實驗主要目的是讓學(xué)生學(xué)會融會貫通，運用所學(xué)知識，綜合訓(xùn)練學(xué)生的實驗技能與方法，完成有實際意義并且具備一定工程量的綜合型網(wǎng)頁站點或開發(fā)項目。創(chuàng)新型實驗主要目的是讓部分優(yōu)秀學(xué)生運用所學(xué)知識，進(jìn)行主動探索與研究，發(fā)現(xiàn)并解決問題，開展例如“javascript語言發(fā)展”、“javascript交叉學(xué)科應(yīng)用”、“參與google競賽”等方向自選題目的科學(xué)技術(shù)研究訓(xùn)練，提高學(xué)生的學(xué)術(shù)研究水平和能力，提高學(xué)生的動手實踐能力。

3.2 課程教學(xué)模式

課程教學(xué)模式采用基于自主學(xué)習(xí)的網(wǎng)絡(luò)化分級教學(xué)模式。由于目前課程建設(shè)還沒有得到普遍認(rèn)可，學(xué)分和學(xué)時數(shù)都比較低，所以用32學(xué)時進(jìn)行課程的主干核心知識講授與引導(dǎo)，其他部分由學(xué)生課后自學(xué)，由主講教師利用“教育在線”網(wǎng)絡(luò)教學(xué)平臺，發(fā)布通知消息、收發(fā)郵件、規(guī)劃教學(xué)日歷、記錄教學(xué)筆記、收發(fā)作業(yè)、共享教學(xué)資源、開展問卷調(diào)查、答疑交流等教學(xué)活動。這樣利用計算機(jī)網(wǎng)絡(luò)實施教學(xué)的好處是既培養(yǎng)了學(xué)生的自主學(xué)習(xí)能力、獨立思考能力，又拓展了教學(xué)場地和教學(xué)時間的限制，有效地為教學(xué)改革鋪設(shè)了良好的基礎(chǔ)。

本課程由于面向全校學(xué)生開放，所以面臨學(xué)生基礎(chǔ)復(fù)雜的問題，表現(xiàn)在“基礎(chǔ)知識掌握程度差異大”、“專業(yè)方向差異大”、“年級跨度大”等方面。為了解決這一難題，課題組計劃采用分級教學(xué)模式，按照學(xué)生的基礎(chǔ)知識掌握程度和專業(yè)方向等維度，進(jìn)行分級并開展教學(xué)。具體的分級原則如表3“學(xué)生分級原則”。

為了保證教育的公平性與公正性，結(jié)合昆明理工大學(xué)生源的具體特點，對各個級別組的學(xué)生的學(xué)習(xí)評價指標(biāo)與方法也做出了大膽的嘗試改革。本課程的評價方式表現(xiàn)為平時簽到成績、理論試題測試（包括Web知識、HTML知識、CSS知識、Javascript等章節(jié)知識）、綜合設(shè)計成績、創(chuàng)新研究成績。其中簽到共10次，根據(jù)簽到次數(shù)計算平時簽到成績，滿分100分；理論試題由“教育在線”根據(jù)主講教師設(shè)計試題庫隨機(jī)抽題組卷，滿分100分；綜合設(shè)計一項，學(xué)生任選，滿分100分；創(chuàng)新性研究一項，學(xué)生任選，滿分100分。具體的評價要求如表4“學(xué)生分級評價”。

4 結(jié)束語

經(jīng)過一年的“Javascript Web開發(fā)與應(yīng)用”教學(xué)經(jīng)驗表明，這種教學(xué)改革能夠明顯提高普通學(xué)生的計算機(jī)素養(yǎng)與分析解決問題的能力，能夠提高優(yōu)秀學(xué)生的創(chuàng)新能力和研究能力，對Javascript類課程教學(xué)和大學(xué)生人才培養(yǎng)模式具有一定的參考價值?！癑avascript Web開發(fā)與應(yīng)用”課程教學(xué)改革是一個長期的過程，我們將結(jié)合前沿成果和技術(shù)，繼續(xù)思考改革的方向。

參考文獻(xiàn)：

[1] 王鶴琴，尹向兵. Javascript教學(xué)方法淺析[J].電腦知識與技術(shù)，2010，6（5）：1146-1147.

[2] 柯琦.Javascript程序設(shè)計基礎(chǔ)課程教學(xué)淺析[J].信息技術(shù)，2013（5）：239-240.

[3] 何志永.Javascript課程教學(xué)優(yōu)化研究[J].教育與職業(yè)，2013（2）：140-141.

[4] 袁國武，徐丹，趙楊. “計算機(jī)圖形學(xué)”實驗課程改革經(jīng)驗與探索[J].計算機(jī)教育，2009（15）：29-32.

[5] 阮文江.Javascript程序設(shè)計基礎(chǔ)教程[M].北京：人民郵電出版社，2010.endprint

（2）實踐經(jīng)驗與應(yīng)用。

（3）高級設(shè)計技巧與應(yīng)用。

課程實驗內(nèi)容采用eclipse平臺作為主要的學(xué)習(xí)、實驗平臺，減少商業(yè)軟件對學(xué)生的影響，避免形成固定的思維模式。Eclipse 是一個開放源代碼的、基于Java的可擴(kuò)展開發(fā)平臺，支持Windows、Linux、Mac等多種操作系統(tǒng)。Eclipse 可以當(dāng)作 C/C++、COBOL、Java 、PHP、Javascript等多種語言的IDE來使用。Eclipse的最大特點是跨平臺、開源免費和優(yōu)秀的插件框架，學(xué)生在熟悉或掌握了它的用法后還可以自定義新的插件，不斷地改進(jìn)實驗的軟件裝置環(huán)境，提高實驗效率和水平。

課程實驗內(nèi)容設(shè)置如表2“課程實驗項目”，共分為驗證型、綜合型、創(chuàng)新型三類實驗。驗證型實驗主要目的是讓學(xué)生對各章節(jié)的離散知識點進(jìn)行驗證，鞏固所學(xué)概念與原理等知識。綜合型實驗主要目的是讓學(xué)生學(xué)會融會貫通，運用所學(xué)知識，綜合訓(xùn)練學(xué)生的實驗技能與方法，完成有實際意義并且具備一定工程量的綜合型網(wǎng)頁站點或開發(fā)項目。創(chuàng)新型實驗主要目的是讓部分優(yōu)秀學(xué)生運用所學(xué)知識，進(jìn)行主動探索與研究，發(fā)現(xiàn)并解決問題，開展例如“javascript語言發(fā)展”、“javascript交叉學(xué)科應(yīng)用”、“參與google競賽”等方向自選題目的科學(xué)技術(shù)研究訓(xùn)練，提高學(xué)生的學(xué)術(shù)研究水平和能力，提高學(xué)生的動手實踐能力。

3.2 課程教學(xué)模式

課程教學(xué)模式采用基于自主學(xué)習(xí)的網(wǎng)絡(luò)化分級教學(xué)模式。由于目前課程建設(shè)還沒有得到普遍認(rèn)可，學(xué)分和學(xué)時數(shù)都比較低，所以用32學(xué)時進(jìn)行課程的主干核心知識講授與引導(dǎo)，其他部分由學(xué)生課后自學(xué)，由主講教師利用“教育在線”網(wǎng)絡(luò)教學(xué)平臺，發(fā)布通知消息、收發(fā)郵件、規(guī)劃教學(xué)日歷、記錄教學(xué)筆記、收發(fā)作業(yè)、共享教學(xué)資源、開展問卷調(diào)查、答疑交流等教學(xué)活動。這樣利用計算機(jī)網(wǎng)絡(luò)實施教學(xué)的好處是既培養(yǎng)了學(xué)生的自主學(xué)習(xí)能力、獨立思考能力，又拓展了教學(xué)場地和教學(xué)時間的限制，有效地為教學(xué)改革鋪設(shè)了良好的基礎(chǔ)。

本課程由于面向全校學(xué)生開放，所以面臨學(xué)生基礎(chǔ)復(fù)雜的問題，表現(xiàn)在“基礎(chǔ)知識掌握程度差異大”、“專業(yè)方向差異大”、“年級跨度大”等方面。為了解決這一難題，課題組計劃采用分級教學(xué)模式，按照學(xué)生的基礎(chǔ)知識掌握程度和專業(yè)方向等維度，進(jìn)行分級并開展教學(xué)。具體的分級原則如表3“學(xué)生分級原則”。

為了保證教育的公平性與公正性，結(jié)合昆明理工大學(xué)生源的具體特點，對各個級別組的學(xué)生的學(xué)習(xí)評價指標(biāo)與方法也做出了大膽的嘗試改革。本課程的評價方式表現(xiàn)為平時簽到成績、理論試題測試（包括Web知識、HTML知識、CSS知識、Javascript等章節(jié)知識）、綜合設(shè)計成績、創(chuàng)新研究成績。其中簽到共10次，根據(jù)簽到次數(shù)計算平時簽到成績，滿分100分；理論試題由“教育在線”根據(jù)主講教師設(shè)計試題庫隨機(jī)抽題組卷，滿分100分；綜合設(shè)計一項，學(xué)生任選，滿分100分；創(chuàng)新性研究一項，學(xué)生任選，滿分100分。具體的評價要求如表4“學(xué)生分級評價”。

4 結(jié)束語

經(jīng)過一年的“Javascript Web開發(fā)與應(yīng)用”教學(xué)經(jīng)驗表明，這種教學(xué)改革能夠明顯提高普通學(xué)生的計算機(jī)素養(yǎng)與分析解決問題的能力，能夠提高優(yōu)秀學(xué)生的創(chuàng)新能力和研究能力，對Javascript類課程教學(xué)和大學(xué)生人才培養(yǎng)模式具有一定的參考價值?！癑avascript Web開發(fā)與應(yīng)用”課程教學(xué)改革是一個長期的過程，我們將結(jié)合前沿成果和技術(shù)，繼續(xù)思考改革的方向。

參考文獻(xiàn)：

[1] 王鶴琴，尹向兵. Javascript教學(xué)方法淺析[J].電腦知識與技術(shù)，2010，6（5）：1146-1147.

[2] 柯琦.Javascript程序設(shè)計基礎(chǔ)課程教學(xué)淺析[J].信息技術(shù)，2013（5）：239-240.

[3] 何志永.Javascript課程教學(xué)優(yōu)化研究[J].教育與職業(yè)，2013（2）：140-141.

[4] 袁國武，徐丹，趙楊. “計算機(jī)圖形學(xué)”實驗課程改革經(jīng)驗與探索[J].計算機(jī)教育，2009（15）：29-32.

[5] 阮文江.Javascript程序設(shè)計基礎(chǔ)教程[M].北京：人民郵電出版社，2010.endprint