玩爽了！直接在Chrome里抓取數據

 一個小測試發現可以自動做題，於是想通過腳本的方式看能不能獲取相應的題庫，剛好可以學習一下JS異步操作。花了一天時間，總算跑順利了，遇到了不少坑。記錄下來分享。

1、JS如何順序執行

JS有強大的異步操作機制，但由於之前順序執行的思路受限，直接用For循環的話會把請求結果的順序搞亂。因此需要讓JS在異步的基礎上還能夠順序執行，基本的辦法是采用Callback的方式。同時為了避免JS在頁面的DOM進行操作過程中出現DOM不存在的情況使用SetTimeout來延時執行（這個地方費了了小半天時間）。

注意由於程序代碼中有使用$.ajax請求，因此把回調的語句放到$ajax請求的Success方法里。

基本代碼結構代碼如下：

var i = 0;
var loopCall = function(count) {
    callProcess(i, function() {
        i++;
        if (i < count) {
            loopCall(count);
        }
    });
};

function callProcess(i, callback) {
    console.log('running on: ' + i.toString());

    //process code
    //...
    //...
    
    //使用setTimeout延時，避免DOM操作錯誤
    setTimeout(function(){callback();},100);
}

loopCall(1000);

 

2.數據怎么存儲

之前只知道有LocalStorage，開發過程中Google了一下才知道有WebSQL，語法和操作也挺簡單，也嘗試過使用數組變量來存儲數據，但發現變量數據大於150K左右的時候瀏覽器就很慢。因此使用WebSQL來存儲

var db = openDatabase(' mydatabase ', '2.0', 'my db', 2 * 1024); 
   db.transaction(function (tx) {   
     tx.executeSql('CREATE TABLE IF NOT EXISTS t1 (id unique, log)'); 
     tx.executeSql('INSERT INTO t1  
                           (id,log) VALUES (?, ?'), [e_id, e_log];  //e_id和e_log是外部變量
   }); 

 

總結

其他處理代碼基本就是原來的頁面代碼拷貝過來修改修改另加一定的調試。之前想用JS來寫一直沒有找到場景，現在用了雖然遇到點問題但總算是克服過了。不過JS在異步調用想處理成同步的多層嵌套之后還是需要好好規划一下，雖然在ES6之后增加了Promise類型。

 

43