招新網站總結... [很水的總結]
個人承認...這次做的不好，粗糙，該改好的還是沒改好，刷了一週多的三級，十天速成，所以也沒時間改..所以會後期再改進..這學期端正態度...其實我有點想發展前端.. 言歸正傳
後臺主要是分為兩個部分，報名和管理，管理我報錯了，沒完成這個部分。捂臉 唉...在這裡立一個flag，我會把這篇部落格重新整理，程式碼改好的（昨天試的時候不知道為什麼學號查重的程式碼有問題了 之前沒有問題的...心煩意亂..）
前端
- 頂部的那個動畫，是用的別人的js...自己還寫不出來那種svg.. 主要用到的是path元素
- 柵欄必須的，響應式會方便
- 用了幾個有意思的外掛：像倒計時和時間軸
時間軸佈局主要是左右對稱的，看了一下別人的原始碼，感覺程式碼的效率很重要，因為這個地方，每個panel都有很大的共性，比如都設了透明度（為了開場動畫他們是漸變的移動和漸變出現）只是佈局一左一右罷了。因為框框裡內容比較少，要注意單獨寫兩個關於文字的屬性，加在前邊，這樣這時候的頁面字是左對齊和右對齊的。【不知道中間的那個樹幹狀是咋做的..研究一下】
倒計時,一開始忘了要獲取本地的時間和自己設定時間了.. 有點傻 後來師父說的時候才想起來，然後師父加的，【$j 是為了解決JQ衝突的問題，代替$用的 】 end和now的差值就是倒計時的時間，這裡是隨便設了一下，nowtime和endtime才是那個正確的時間
<div class="block"> <div id="countdown2" class="ClassyCountdownDemo"><span style="display:block;text-align: center;font-family: 'Consolas','Courier New', Courier, mono,serif;font-size: 30px" id="timeinfo">離報名還有：</span></div> <script> var $j = jQuery.noConflict(); $j(document).ready(function() { nowtime = Math.round(new Date().getTime() / 1000).toString(); endtime = Math.round(new Date("September 10,2018 00:00:00") / 1000).toString(); $j('#countdown2').ClassyCountdown({ // end: '1001618000', end:"1001618004", now: "1001618000", labels: true, style: { element: "", textResponsive: .5, days: { gauge: { thickness: .01, bgColor: "rgba(0,0,0,0.05)", fgColor: "#1abc9c" }, textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;' }, hours: { gauge: { thickness: .01, bgColor: "rgba(0,0,0,0.05)", fgColor: "#2980b9" }, textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;' }, minutes: { gauge: { thickness: .01, bgColor: "rgba(0,0,0,0.05)", fgColor: "#8e44ad" }, textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;' }, seconds: { gauge: { thickness: .01, bgColor: "rgba(0,0,0,0.05)", fgColor: "#f39c12" }, textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;' } }, onEndCallback: function() { console.log("Time out!"); inputlist = $('form input'); $('#timeinfo').text("開始報名"); for (var i = 0; i < inputlist.length; i++) { $(inputlist[i]).attr('disabled',false); } $('button[type=submit]').attr('disabled',false); } }); }); </script> </div>
- 那個組別的地方，原來是想用一本書來做的，也沒調的很好，被否決了... 虧我改了十個多小時...捂臉。後來就用的簡單的，本來想用錨點定位啥的，給定一個最外邊的框，然後overflow：hidden 這種最基礎的，但是後來發現，可能每個組簡介不一樣長... 直接偷懶...給那個上邊的li加個事件.. 去控制其他兩個組的部分的display,,,發現自己現在好喜歡隱藏..太偷懶了，但是覺得這樣，肯定會以後釀成問題的
display:none;
display:block;- 氣泡詞雲其實就是一個移動的過程
後臺
盜用我恆哥的
DAO —— Data Access Object資料訪問物件（介面）
DAOImpl 上面的實現類
entity —— 資料的物件
Service（不是Server）——就是中間層、邏輯層（介面）
ServiceImpl就是上面的實現類
util就是工具類的包
Servlet——JAVA WEB小應用。
寫程式碼的時候為了清晰，簡潔的分了一下層
先說一下資料處理部分
package qmx_model;
public class student {
private String st_id;
private String studentname;
private String phone;
private String sex;
public student() {
super();
}
public student(String studentname,String st_id,String phone,String sex){
this.studentname = studentname;
this.phone = phone;
this.st_id = st_id;
this.sex = sex;
}
public String getStudentname() {
return studentname;
}
public void setStudentname(String studentname) {
this.studentname = studentname;
}
public String getPhone() {
return phone;
}
public void setPhone(String phone) {
this.phone = phone;
}
public String getS_id() {
return st_id;
}
public void setS_id(String s_id) {
this.st_id = s_id;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
}
JavaBean在mvc設計模型中是model，又稱模型層，也稱資料層，用來設計資料的屬性和行為的，提供獲取屬性和設定屬性的get/set方法。 直觀感覺就是...get/set了...
DAO部分，DAO是Data Access Object資料訪問介面，資料訪問：顧名思義就是與資料庫打交道。夾在業務邏輯與資料庫資源中間。 在核心J2EE模式中是這樣介紹DAO模式的：為了建立一個健壯的J2EE應用，應該將所有對資料來源的訪問操作抽象封裝在一個公共API中。用程式設計的語言來說，就是建立一個介面，介面中定義了此應用程式中將會用到的所有事務方法。在這個應用程式中，當需要和資料來源進行互動的時候則使用這個介面，並且編寫一個單獨的類來實現這個介面在邏輯上對應這個特定的資料儲存
所以錄入資訊的insert在這裡了，有一個問題是王哥提到的預編譯問題，當時王哥說的時候沒聽懂.. 後來意識到的，其實寫了這個的。PreparedStatement就是預編譯語句了，寫這個比statement要長几句話而已，查了一下二者區別，如下：、
給我最直觀的感受就是 statement寫Sql語句是這樣的：
String sql = "insert into examstudent" + " values("
+ student.getFlowId() + "," + student.getType() + ",'"
+ student.getIdCard() + "','" + student.getExamCard() + "','"
+ student.getStudentName() + "','" + student.getLocation()
+ "'," + student.getGrade() + ")";PreparedStatement可以傳入帶佔位符的SQL語句，提供了補充佔位符變數的方法，所以sql語句就變成了：
PreparedStatement ps=conn.preparedStatement(sql);
String sql="insert into examstudent values(?,?,?,?,?,?,?)";使用PreparedStatement的好處：
1).提高程式碼的可讀性和可維護性;
2).最大程度的提高效能:JDBC驅動的最佳化是基於使用的是什麼功能. 選擇PreparedStatement還是Statement取決於你要怎麼使用它們. 對於只執行一次的SQL語句選擇Statement是最好的. 相反, 如果SQL語句被多次執行選用PreparedStatement是最好的.PreparedStatement的第一次執行消耗是很高的. 它的效能體現在後面的重複執行(快取的作用). 例如, 假設我使用Employee ID, 使用prepared的方式來執行一個針對Employee表的查詢. JDBC驅動會發送一個網路請求到資料解析和優化這個查詢. 而執行時會產生另一個網路請求. 在JDBC驅動中，減少網路通訊是最終的目的. 如果我的程式在執行期間只需要一次請求, 那麼就使用Statement. 對於Statement, 同一個查詢只會產生一次網路到資料庫的通訊.當使用PreparedStatement池時, 如果一個查詢很特殊, 並且不太會再次執行到, 那麼可以使用Statement. 如果一個查詢很少會被執行,但連線池中的Statement池可能被再次執行, 那麼請使用PreparedStatement. 在不是Statement池的同樣情況下, 請使用Statement.
3).可以防止SQL注入
SQL注入指的是通過構建特殊的輸入作為引數傳入Web應用程式，而這些輸入大都是SQL語法裡的一些組合，通過執行SQL語句進而執行攻擊者所要的操作，其主要原因是程式沒有細緻地過濾使用者輸入的資料，致使非法資料侵入系統。
報名邏輯比較清晰簡單，在Servlet裡， 學號查重一下，在dao查詢一下然後如果有查詢到就新增到一個物件裡，然後在servlet新增一個條件判斷，那個物件空的就執行後面的，呼叫dao裡的insert去新增資訊到資料庫，寫的時候最好在各個環節把報名資訊syso一下， 因為我一開始出現了一點編碼問題，為了確認編碼是在哪裡開始有誤，這樣還挺容易判斷的。
使用者頁面就是JDBC的一個增刪改查，我有一個類報錯了 等改好了再來總結這一部分，主要是在jsp裡去做這個增刪改查，所以到時候需要總結jdbc和jsp
很慚愧...捂臉