資源描述:
《dreamweaver基礎教程—使用dreamweaver開發(fā)javascript腳本》由會員上傳分享,免費在線閱讀,更多相關內(nèi)容在教育資源-天天文庫。
1、使用Dreamweaver開發(fā)JavaScript腳本使用Dreamweaver開發(fā)JavaScript腳本我們已經(jīng)介紹過Web?前端設計的邏輯層概念,它主要集中在JavaScript技術上。相對于HTML和CSS技術的完美支持,Dreamweaver?對于JavaScript技術的支持可以說是姍姍來遲,且比較有限。早期的Dreamweaver?使用“行為”概念打包常用的JavaScript功能塊,而對于JavaScript語言本身的支持基本上沒有,僅能夠分色顯示JavaScript關鍵字。從Dreamweaver?CS3?版本開始,Adobe
2、把過多的精力集中在Ajax框架的開發(fā)上,忽略了基礎性技術支持。而Dreamweaver?所開發(fā)的Spry框架雖然功能很強大,但是卻無法與jQuery、Prototype等基礎性Ajax?框架相比較。用Adobe官方解釋,Spry技術是為Web設計師開發(fā)的Ajax框架,而不是為Web程序員開發(fā)的基礎性架構(gòu),但是它與ExtJS和YUI等框架相比,界面效果和交互性功能方面又顯得比較粗糙和弱小。升級到Dreamweaver?CS4版本后,Adobe開始把精力放在JavaScript核心技術支持上,現(xiàn)在能夠支持JavaScript代碼核心智能提示,并提供
3、了幾個實用工具。坦率地講,Dreamweaver?不是開發(fā)JavaScript的最佳工具,但是作為一款Web?綜合編輯環(huán)境,對于廣大初學者來說仍然是首選工具,如果結(jié)合Dreamweaver?所附帶的Spry技術框架,相信你能夠輕松設計各種常用腳本功能。本章將詳細講解Dreamweaver?如何支持JavaScript技術,其中包括腳本服務、行為和Spry技術框架。1Dreamweaver中的JavaScript在Dreamweaver?CS4版本之前,Dreamweaver?僅能夠支持JavaScript代碼的分色顯示,且功能有限。升級到Dre
4、amweaver?CS4版本后,Adobe開始意識到JavaScript在Web開發(fā)中的重要性,并加大了對其基礎性技術的支持,這主要包括三個方面的支持服務。1.1?結(jié)構(gòu)和邏輯的分離在Web?開發(fā)中,用戶常常在頁面內(nèi)直接編寫JavaScript腳本,有時甚至把JavaScript函數(shù)以屬性事件的形式綁到標簽中,這樣做不符合標準設計的規(guī)范(即倡導結(jié)構(gòu)、表現(xiàn)和邏輯的分離),同時也不便于JavaScript腳本管理和利用率,因此建議讀者應養(yǎng)成在外部文件中開發(fā)JavaScript腳本并在外部文件中注冊事件處理函數(shù)的習慣。Dreamweaver?考慮到部分
5、用戶已經(jīng)形成的習慣,提供了將JavaScript外置的工具。例如,在下面這個簡單文檔中,我們在頭部區(qū)域定義一個JavaScript函數(shù),然后在超鏈接中綁定該函數(shù)到onclick屬性上,當單擊超鏈接時,會自動觸發(fā)函數(shù),彈出一個提示信息對話框。569網(wǎng)頁制作與網(wǎng)站開發(fā)從入門到精通
?
?
分離結(jié)構(gòu)和邏輯6、e>
?
Hello?World?這種把HTML和JavaScript混在一起編寫的方法顯然不符合標準設計的原則。Dreamweaver?提供了一個簡單的工具,它能夠把HTML文檔中的JavaScrip7、t代碼自動放置在獨立的JS文件中,實現(xiàn)結(jié)構(gòu)和邏輯的分離。例如,針對上面示例,在Dreamweaver?中選擇【命令】
8、【將JavaScript外置】命令,打開【將JavaScript外置】對話框,如圖1?所示。該對話框有兩個選項:一個是【僅將JavaScript外置】單選按鈕,它能夠把文檔內(nèi)包含的腳本放置到外部文件中,并引入該文件。例如,在上面示例中,可以把
9、另一個是【將JavaScript外置并以非侵入方式進行附加】單選按鈕,該單選按鈕除了能夠把文檔內(nèi)包含的JavaScript腳本外置之外,還可以把標簽內(nèi)