jQuery - AJAX、mysql的優化

一)jQuery常用AJAX-API

目的:簡化客戶端與服務端進行局部刷新的異步通訊

1)取得服務端當前時間

  • 簡單形式:jQuery對象.load(url)
    • 返回結果自動添加到jQuery對象代表的標簽中間; 如果是Servlet的話, 采用的是GET方式
  • 復雜形式:
    • jQuery對象.load(url,sendData,function(backData,textStatus,ajax){... ...}); sendData = {"user.name":"jack","user.pass":"123"}; ( 以JSON格式文本方式發送,使用POST方式發送,服務端能收到數據 )
    • load()方法參數解釋:
      • 參數一:url發送到哪里去
      • 參數二:sendData發送請求體中的數據,符合JSON格式,例如:{key:value,key:value}
      • 參數三:function處理函數,類似于傳統方式ajax.onreadystatechange = 處理函數
      • 其中參數三為function處理函數最多可以接收三個參數,含義如下
        • 第一個參數:服務端返回的數據,例如:backData
        • 第二個參數:服務端狀態碼的文本描述,例如:success、error、
        • 第三個參數:ajax異步對象,即XMLHttpRequest對象
        • 以上所有參數的名字可以任意,但必須按順序書寫,盡量做到見名知意
    • 注意:對于load方法而言,如果請求體無參數發送的話,load方法采用GET方式提交; 如果請求體有參數發送的話,load方法采用POST方式提交; 使用load方法時,自動進行編碼,無需手工編碼
    <script type="text/javascript">
        $(":button").click(function(){
            var url = "${pageContext.request.contextPath}/loadTimeRequest?time"+new Date().getTime();
            var sendData = null;
            $.load(url,sendData,function(a,b,ajax){
                var jsonJAVA = ajax.responseText;
                var jsonJS = eval("("+jsonJAVA+")");
                var strTime = jsonJS.strTime;
                $("span:first").html(strTime).css("color","red");
                $("span:last").html(strTime).css("color","blue");
            });
            //$("span").load(url);
        });
    </script>

2)檢查注冊用戶名和密碼是否存在

  • $.get(url,sendData,function(backData,textStatus,ajax){... ...})
  • $.post(url,sendData,function(backData,textStatus,ajax){... ...})-> 提倡
  • 注意 : 使用get或post方法時,自動進行編碼,無需手工編碼

3)jQuery對象.serialize()

  • 作用:自動生成JSON格式的文本
  • 注意:為每個jQuery對象設置一個name屬性,因為name屬性會被認為請求參數名
  • 注意:必須用<form>標簽元素
  • 適用:如果屬性過多,強烈推薦采用這個API
    <script type="text/javascript">
        //定位按鈕,同時添加單擊事件
        $(":button").click(function(){
            //獲取用戶名和密碼
            var username = $(":text:first").val();
            var password = $(":text:last").val();
            //去空格
            username = $.trim(username);
            password = $.trim(password);
            //異步發送到服務端
            var url = "${pageContext.request.contextPath}/checkRequest?time="+new Date().getTime();
            /*手工書寫JSON文本
            var sendData = {
                "user.username":username,
                "user.password":password
            };
            */
            /*工具生成JSON文本*/
            var sendData = $("form").serialize();
            $.post(url,sendData,function(backData,textStatus,ajax){
                //backData是一個JSON文本/對象,你得通過.號訪問其屬性值
                var tip = backData.tip;
                //創建img節點
                var $img = $("![](" + tip + ")")
                //清空span節點中的內容
                $("span").text("");
                //將img節點添加到span節點中
                $("span").append( $img );
            });
        });
    </script>
public class RegisterAction extends ActionSupport{
    private User user;
    public User getUser() {
        return user;
    }
    public void setUser(User user) {
        this.user = user;
    }
    /**
     * 檢查注冊用戶名和密碼是否存在
     */
    public String checkMethod() throws Exception {
        tip = "images/MsgSent.gif";
        if("帥帥".equals(user.getUsername()) && "123".equals(user.getPassword())){
            tip = "images/MsgError.gif";
        }
        return "ok";
    }
    private String tip;
    public String getTip() {
        return tip;
    }
    /**
     * var backData = {
     *                  "tip":"images/MsgError.gif"
     *                }
     */
}

4)jQuery解析XML

  • xml :
<?xml version="1.0" encoding="UTF-8"?>
<root>
    <city>廣州</city>
    <city>中山</city>
    <city>深圳</city>
    <city>佛山</city>
    <city>珠海</city>
</root>
  • jQuery :
<script type="text/javascript">
        $(":button").click(function(){
            var url = "${pageContext.request.contextPath}/03_city.xml";
            var sendData = null;
            $.get(url,sendData,function(backData,textStatus,ajax){
                /*
                //將xml文件轉成jquery對象,目的是用jquery api解析xml文件
                var $xml = $(backData);
                var $city = $xml.find("city");
                $city.each(function(){
                    //獲取每一個city節點
                    var city = $(this).text();
                    alert(city);
                });
                */
                var xml = ajax.responseXML;
                var $xml = $(xml);
                var $city = $xml.find("city");
                $city.each(function(){
                    //獲取每一個city節點
                    var city = $(this).text();
                    alert(city);
                });
            });
        });
    </script>

5)省份-城市,基于jQuery的AJAX二級聯動,用Struts2整合AJAX【非數據庫版】

  • js :
    <select id="province">
        <option>選擇省份</option>
        <option>廣東</option>
        <option>湖南</option>
    </select>
    <select id="city">
        <option>選擇城市</option>
    </select>
<script type="text/javascript">
        $("#province").change(function(){
            //刪除原城市下拉框中的內容,除第一項外
            $("#city option:gt(0)").remove();
            var province = $("#province option:selected").text();
            if("選擇省份" != province){
                $.ajax({
                    "type":"POST",
                    "url":"${pageContext.request.contextPath}/findCityByProvince?time="+new Date().getTime(),
                    "sendData":{"province":province},
                    "success":function(backData,textStatus,ajax){
                        //js對象
                        var city = backData.cityList;
                        //jquery對象
                        var $city = $(city);
                        //each()
                        $city.each(function(){
                            //this表示每個城市
                            var $option = $("<option>" + this + "</option>");
                            $("#city").append( $option );
                        });
                    }
                });
            }
        });
    </script>
  • java :
public class ProvinceCityAction extends ActionSupport{
    private String province;//廣東
    public void setProvince(String province) {
        this.province = province;
    }
    public String findCityByProvince() throws Exception {
        cityList = new ArrayList<String>();
        if("廣東".equals(province)){
            cityList.add("湛江");
            cityList.add("汕頭");
        }else if("湖南".equals(province)){
            cityList.add("邵陽");
            cityList.add("瀏陽");
        }
        return "ok";
    }
    private List<String> cityList;
    public List<String> getCityList() {
        return cityList;
    }
    /**
     * var backData = {
     *                   "cityList":["邵陽","瀏陽"]
     *                }
     */
}
  • struts :
<struts>
   <package name="timePackage" extends="json-default" namespace="/">
        <global-results>
            <result name="ok" type="json"/>
        </global-results>

        <!-- 獲取服務端時間 -->
        <action 
            name="loadTimeRequest" 
            class="cn.itcast.javaee.js.time.TimeAction" 
            method="loadTimeMethod"/>

        <!-- 檢查用戶名和密碼是否存在 -->
        <action 
            name="checkRequest" 
            class="cn.itcast.javaee.js.register.RegisterAction" 
            method="checkMethod"/>
            
        <!-- 根據省份查詢城市 -->   
        <action 
            name="findCityByProvince" 
            class="cn.itcast.javaee.js.provincecity.ProvinceCityAction" 
            method="findCityByProvince"/>
   </package>
</struts>

二)掌握Java調用Oracle過程與函數

  • 寫一個計算個人所得稅的應用
    • sql :
--定義過程
create or replace procedure get_rax(salary in number,rax out number)
as
    --需要交稅的錢
    bal number;
begin
    bal := salary - 3500;
    if bal<=1500 then
       rax := bal * 0.03 - 0;
    elsif bal<=4500 then
       rax := bal * 0.1 - 105;
    elsif bal<=9000 then
       rax := bal * 0.2 - 555;
    elsif bal<=35000 then
       rax := bal * 0.25 - 1005;
    elsif bal<=55000 then
       rax := bal * 0.3 - 2755;
    elsif bal<=80000 then
       rax := bal * 0.35 - 5505;
    else
       rax := bal * 0.45 - 13505;
    end if;
end;
/
--調用過程
declare
   --交稅
   rax number; 
   salary number := &salary;
begin
   get_rax(salary,rax); 
   dbms_output.put_line(salary||'元工資需要交'||rax||'元稅');
end;
/
  • java :
public class TestCallOracleProc {
    public static void main(String[] args) throws Exception{
        String sql = "{call get_rax(?,?)}";
        Connection conn = JdbcUtil.getConnection();
        CallableStatement cstmt = conn.prepareCall(sql);
        cstmt.setInt(1,10000);
        cstmt.registerOutParameter(2,Types.INTEGER);
        cstmt.execute();
        Integer rax = cstmt.getInt(2);
        System.out.println("10000元需要交" + rax + "元稅");
        JdbcUtil.close(cstmt);
        JdbcUtil.close(conn);
    }
}
  • 查詢7788號員工的的姓名,職位,月薪
    • sql語句 :
--定義函數
create or replace function findEmpNameAndJobAndSal(pempno in number,pjob out varchar2,psal out number) 
return varchar2
as
    pename emp.ename%type;
begin
    select ename,job,sal into pename,pjob,psal from emp where empno = pempno;
    return pename;
end;
/
--調用函數
declare
    pename emp.ename%type;
    pjob   emp.job%type;
    psal   emp.sal%type;
begin
    pename := findEmpNameAndJobAndSal(7788,pjob,psal);
    dbms_output.put_line('7788'||'--'||pename||'--'||pjob||'--'||psal);
end;
/
  • java :
public class TestCallOracleFunc {
    public static void main(String[] args) throws Exception{
        String sql = "{?=call findEmpNameAndJobAndSal(?,?,?)}";
        Connection conn = JdbcUtil.getConnection();
        CallableStatement cstmt = conn.prepareCall(sql);
        cstmt.registerOutParameter(1,Types.VARCHAR);
        cstmt.setInt(2,7788);
        cstmt.registerOutParameter(3,Types.VARCHAR);
        cstmt.registerOutParameter(4,Types.INTEGER);
        cstmt.execute();
        String ename = cstmt.getString(1);
        String job = cstmt.getString(3);
        Integer sal = cstmt.getInt(4);
        System.out.println(ename+":"+job+":"+sal);
        JdbcUtil.close(cstmt);
        JdbcUtil.close(conn);
    }
}

三)mysql的優化

  • 為什么要優化:隨著實際項目的啟動,數據庫經過一段時間的運行,最初的數據庫設置,會與實際數據庫運行性能會有一些差異,這時我們就需要做一個優化調整

  • 數據庫優化這個課題較大,可分為四大類:

    1. 主機性能
    2. 內存使用性能
    3. 網絡傳輸性能
    4. SQL語句執行性能【軟件工程師】
  • 下面列出一些數據庫SQL優化方案:
    -1)選擇最有效率的表名順序(筆試常考)

    • 數據庫的解析器按照從右到左的順序處理FROM子句中的表名,FROM子句中寫在最后的表將被最先處理,在FROM子句中包含多個表的情況下,你必須選擇記錄條數最少的表放在最后,如果有3個以上的表連接查詢,那就需要選擇那個被其他表所引用的表放在最后。
    • 例如:查詢員工的編號,姓名,工資,工資等級,部門名
      select emp.empno,emp.ename,emp.sal,salgrade.grade,dept.dname
      from salgrade,dept,emp
      where (emp.deptno = dept.deptno) and (emp.sal between salgrade.losal and salgrade.hisal)          
- 1)如果三個表是完全無關系的話,將記錄和列名最少的表,寫在最后,然后依次類推
- 2)如果三個表是有關系的話,將引用最多的表,放在最后,然后依次類推

-2)WHERE子句中的連接順序(筆試常考)
- 數據庫采用自右而左的順序解析WHERE子句,根據這個原理,表之間的連接必須寫在其他WHERE條件之左, 那些可以過濾掉最大數量記錄的條件必須寫在WHERE子句的之右。
- 例如:查詢員工的編號,姓名,工資,部門名

      select emp.empno,emp.ename,emp.sal,dept.dname
      from emp,dept
      where (emp.deptno = dept.deptno) and (emp.sal > 1500)   

-3)SELECT子句中避免使用*
- 數據庫在解析的過程中,會將*依次轉換成所有的列名,這個工作是通過查詢數據字典完成的,這意味著將耗費更多的時間 : select empno,ename from emp;

-4)用TRUNCATE替代DELETE

-5)盡量多使用COMMIT : 因為COMMIT會釋放回滾點

-6)用WHERE子句替換HAVING子句, WHERE先執行,HAVING后執行

-7)多使用內部函數提高SQL效率

-8)使用表的別名 : salgrade s

-9)使用列的別名 : ename e

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,460評論 6 538
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,067評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 177,467評論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,468評論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,184評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,582評論 1 325
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,616評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,794評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,343評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,096評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,291評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,863評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,513評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,941評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,190評論 1 291
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,026評論 3 396
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,253評論 2 375

推薦閱讀更多精彩內容

  • 1.簡介 數據存儲有哪些方式?電子表格,紙質文件,數據庫。 那么究竟什么是關系型數據庫? 目前對數據庫的分類主要是...
    喬震閱讀 1,754評論 0 2
  • 1. Java基礎部分 基礎部分的順序:基本語法,類相關的語法,內部類的語法,繼承相關的語法,異常的語法,線程的語...
    子非魚_t_閱讀 31,729評論 18 399
  • 查詢基礎 算術運算符 (+)(-)(*)(/) 值得注意的是:/ 在oracle中就相當于顯示中的除法 5/2 =...
    Autism_37a1閱讀 484評論 0 0
  • 旅程、左右萬里。 時差、卻最多一天。 護照、印著美利堅。 回首、只不過昨天。 行裝、現在黑色。 內心、卻仍是此間少...
    寥天皓月閱讀 234評論 2 1
  • .例1. 南非一個大學Marks Chabel教授的博士論文,其內容大多數剽竊自佛羅里達大學Kimberly La...
    黃虎閱讀 166評論 0 2