第10講靜態(tài)網(wǎng)站項目設計與開發(fā)_第1頁
第10講靜態(tài)網(wǎng)站項目設計與開發(fā)_第2頁
第10講靜態(tài)網(wǎng)站項目設計與開發(fā)_第3頁
第10講靜態(tài)網(wǎng)站項目設計與開發(fā)_第4頁
第10講靜態(tài)網(wǎng)站項目設計與開發(fā)_第5頁
已閱讀5頁,還剩25頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

靜態(tài)網(wǎng)站項目設計與開發(fā)授課老師:何王科靜態(tài)網(wǎng)站項目設計與開發(fā)課程教學信息授課專業(yè)互聯(lián)網(wǎng)營銷授課班級計網(wǎng)1401班計網(wǎng)1402班課次第9講授課時間10月15日星期星期三節(jié)次1~2授課地點知行樓513機房授課教師何王科教學日志教學日志教學文件課程標準授課計劃教學設計靜態(tài)網(wǎng)站項目設計與開發(fā)教學任務下拉及多級彈出菜單知識目標:htmlcss基礎知識能力目標:熟練運用DIV+CSS布局重點:改變文本框和文本域樣式用圖片美化按鈕改變下拉列表樣式難點:用label標簽提升用戶體驗教學方法:案例法、演示法、討論法、任務驅動法課堂類型:講授課教具:多媒體、VMare、XP、windows2003、Packettracert、GNS3導入課程首先說一下我們這節(jié)課的知識點JavaScript簡介JavaScript使用JavaScript輸出JavaScript語句什么是JavaScriptJavaScript是屬于網(wǎng)絡的腳本語言!JavaScript被數(shù)百萬計的網(wǎng)頁用來改進設計、驗證表單、檢測瀏覽器、創(chuàng)建cookies,以及更多的應用。JavaScript是因特網(wǎng)上最流行的腳本語言。JavaScript是腳本語言JavaScript是一種輕量級的編程語言。JavaScript是可插入HTML頁面的編程代碼。JavaScript插入HTML頁面后,可由所有的現(xiàn)代瀏覽器執(zhí)行。JavaScript很容易學習。JavaScript使用HTML中的腳本必須位于<script>與</script>標簽之間。腳本可被放置在HTML頁面的<body>和<head>部分中。<script>標簽如需在HTML頁面中插入JavaScript,請使用<script>標簽。<script>和</script>會告訴JavaScript在何處開始和結束。<script>和</script>之間的代碼行包含了JavaScript:<script>alert("MyFirstJavaScript");</script><body>中的JavaScript<!DOCTYPEhtml><html><body><p>JavaScript能夠直接寫入HTML輸出流中:</p><script>document.write("<h1>Thisisaheading</h1>");document.write("<p>Thisisaparagraph.</p>");</script><p>您只能在HTML輸出流中使用<strong>document.write</strong>。如果您在文檔已加載后使用它(比如在函數(shù)中),會覆蓋整個文檔。</p></body></html>JavaScript函數(shù)和事件上面例子中的JavaScript語句,會在頁面加載時執(zhí)行。通常,我們需要在某個事件發(fā)生時執(zhí)行代碼,比如當用戶點擊按鈕時。如果我們把JavaScript代碼放入函數(shù)中,就可以在事件發(fā)生時調用該函數(shù)。<head>或<body>中的JavaScript可以在HTML文檔中放入不限數(shù)量的腳本。腳本可位于HTML的<body>或<head>部分中,或者同時存在于兩個部分中。通常的做法是把函數(shù)放入<head>部分中,或者放在頁面底部。這樣就可以把它們安置到同一處位置,不會干擾頁面的內容。<head>中的JavaScript函數(shù)在本例中,我們把一個JavaScript函數(shù)放置到HTML頁面的<head>部分。該函數(shù)會在點擊按鈕時被調用:<!DOCTYPEhtml><html><head><script>functionmyFunction(){document.getElementById("demo").innerHTML="MyFirstJavaScriptFunction";}</script></head><body><h1>MyWebPage</h1><pid="demo">AParagraph.</p><buttontype="button"onclick="myFunction()">點擊這里</button></body></html><body>中的JavaScript函數(shù)在本例中,我們把一個JavaScript函數(shù)放置到HTML頁面的<body>部分。該函數(shù)會在點擊按鈕時被調用:<!DOCTYPEhtml><html><body><h1>MyFirstWebPage</h1><pid="demo">AParagraph.</p><buttontype="button"onclick="myFunction()">點擊這里</button><script>functionmyFunction(){document.getElementById("demo").innerHTML="MyFirstJavaScriptFunction";}</script></body></html>外部的JavaScript也可以把腳本保存到外部文件中。外部文件通常包含被多個網(wǎng)頁使用的代碼。外部JavaScript文件的文件擴展名是.js。如需使用外部文件,請在<script>標簽的"src"屬性中設置該.js文件:<!DOCTYPEhtml><html><body><scriptsrc="myScript.js"></script></body></html>外部的JavaScript在<head>或<body>中引用腳本文件都是可以的。實際運行效果與您在<script>標簽中編寫腳本完全一致。提示:外部腳本不能包含<script>標簽。JavaScript輸出JavaScript通常用于操作HTML元素。操作HTML元素如需從JavaScript訪問某個HTML元素,您可以使用document.getElementById(id)方法。請使用"id"屬性來標識HTML元素:操作HTML元素<body><h1>MyFirstWebPage</h1><pid="demo">MyFirstParagraph.</p><script>document.getElementById("demo").innerHTML="MyFirstJavaScript";</script></body>寫到文檔輸出下面的例子直接把<p>元素寫到HTML文檔輸出中:<body><h1>MyFirstWebPage</h1><script>document.write("<p>MyFirstJavaScript</p>");</script></body>寫到文檔輸出警告請使用document.write()僅僅向文檔輸出寫內容。如果在文檔已完成加載后執(zhí)行document.write,整個HTML頁面將被覆蓋:寫到文檔輸出<body><h1>MyFirstWebPage</h1><p>MyFirstParagraph.</p><buttononclick="myFunction()">點擊這里</button><script>functionmyFunction(){document.write("糟糕!文檔消失了。");}</script></body>JavaScript語句JavaScript語句向瀏覽器發(fā)出的命令。語句的作用是告訴瀏覽器該做什么。下面的JavaScript語句向id="demo"的HTML元素輸出文本"HelloWorld":document.getElementById("demo").innerHTML="HelloWorld";分號;分號用于分隔JavaScript語句。通常我們在每條可執(zhí)行的語句結尾添加分號。使用分號的另一用處是在一行中編寫多條語句。提示:您也可能看到不帶有分號的案例。在JavaScript中,用分號來結束語句是可選的。JavaScript代碼JavaScript代碼(或者只有JavaScript)是JavaScript語句的序列。瀏覽器會按照編寫順序來執(zhí)行每條語句。本例將操作兩個HTML元素:JavaScript代碼<body><h1>MyWebPage</h1><pid="demo">AParagraph.</p><divid="myDIV">ADIV.</div><script>document.getElementById("demo").innerHTML="HelloWorld";document.getElementById("myDIV").innerHTML="Howareyou?";</script></body>JavaScript代碼塊JavaScript語句通過代碼塊的形式進行組合。塊由左花括號開始,由右花括號結束。塊的作用是使語句序列一起執(zhí)行。JavaScript函數(shù)是將語句組合在塊中的典型例子。下面的例子將運行可操作兩個HTML元素的函數(shù):JavaScript代碼塊<body><h1>MyWebPage</h1><pid="myPar">Iamaparagraph.</p><divid="myDiv">Iamadiv.</div><p><buttontype="button"onclick="myFunction()">點擊這里</button></p><script>functionmyFunction(){document.getElementById("myPar").innerHTML="HelloWorld";document.getElementById("myDiv").innerHTML="Howareyou?";}</script><p>當您點擊上面的按鈕時,兩個元素會改變。</p></body>JavaScript對大小寫敏感。JavaScript對大小寫是敏感的。當編寫JavaScript語句時,請留意是否關閉大小寫切換鍵。函數(shù)getElementById與getElementbyID是不同的。同樣,變量myVa

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論