1.啟動tomcat那些准備就不說了。
2.在tomcat的webapps目錄下創建firstDemo文件夾，在其下面建css和js文件夾，還有建index.html css下創建一個css，js下建兩個js分別為first.js和jquery.min.js
3.first.js下放如下：
1 $(document).ready(function(){ 2 $("button").click(function(){ 3 $("#testDiv").hide(); 4 }); 5 });
jquery.min.js放這個網站上面的代碼：http://libs.baidu.com/jquery/2.0.0/jquery.min.js
index.html寫入：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>靜態html頁面(runoob.com)</title> 6 <script src="js/jquery.min.js"></script> 7 <script src="js/first.js></script>“ 8 </head> 9 <body> 10 <div id="testDiv">這是一個標題</div> 11 <button>點我<button> 12 </body> 13 </html>
此三個文件都是用記事本建立，再改后綴。打開是用Notepad++
4.運行index.html 出來界面如下：
出錯了，無法加載，右鍵該頁面單擊檢查：
認真回去查看index，發現
這里的第二行最后引號用錯，
重新運行index，
怎么有兩個按鈕，再修改
，最后，出來如下界面
5.打開該靜態網頁的三種方式：
（1）雙擊html，上面已有，不贅述。
（2）訪問http://127.0.0.1:8080/firstDemo/index.html
（3）訪問http://169.254.248.224:8080/firstDemo/index.html 其中169.254.248.224為本機的IP地址，查找方法可以看上一篇【開始運行快捷鍵】的小技巧
6.總結:
1).細心注意符號的完整性，格式規范，”位置要放對；<button>和</button>是成對出現的，以表示按鈕定義結束。
2）.在網頁可以右鍵查看網頁源代碼、檢查，方便讀取、修改。
3）文件的作用：html是頁面，js（javascript）是行為代碼，css是樣式和布局，美化效果。