禪道項目管理軟件bug過濾腳本

新公司使用禪道做bug管理系統。每次產品上線的時候，全部的測試人員測試出bug之就就提在禪道上。
因爲咱們公司目前的測試只有一個，就把不少產品拉來湊數。他們分不清bug和需求。因此每每出現的狀況是一大屏的bug。但實際上能改的沒幾個。而且有不少bug是後端的。
要從那麼多bug中找出來本身能改的，每次都要從那麼多bug中來看，每每看得眼都花了，也沒找出來幾個有效bug，恰恰又不能處理掉，由於其餘人可能要看。

因而決定花點時間寫個腳原本幫我處理一下那些干擾信息。把那些我不須要看到的條目隱藏起來。
要在bug列表table每一行加一個隱藏按鈕。點擊的話會隱藏掉該行。而且把該行的checkbox的value值記錄到localStorage中。

在console控制檯運行腳本，會作這幾件事：
1.給table全部的a標籤加屬性target="_blank"，這樣就會到新頁面打開bug詳情。避免本頁跳轉致使腳本失效。
2.把全部tr行中的checkbox的值放到該tr上。data-id屬性中。方便後續操做。
3.每行加一個隱藏按鈕。並給它綁定事件。點擊按鈕隱藏此行。把最後一個td加長。
4.把localStorage保存的全部值的行隱藏起來。

爲了不翻頁引發頁面跳轉。先要把每一頁的數量調大一些。這樣操做就在同一個頁面上，不須要屢次運行腳本了。
原來的bug可能有這麼多：

運行腳本以後的效果（不少條幹擾信息已經被我隱藏掉了）：

能夠看到每一行的右邊都加了一個隱藏按鈕。咱們看過bug以後以爲是本身不用理會的。就能夠點擊隱藏。
而且下次打開頁面再次運行腳本，你以前隱藏過的就會自動隱藏起來。
這樣就能很大程度上減小干擾信息了。

另外，這個代碼通用性也是比較強的。換一個系統，要實現相似的功能只須要稍做改動就能夠。

下面是代碼：

function CD(){}

CD.prototype = {
    init:function(){
        this.open();
        this.hideItems();
        this.bindEvent();
    },
    open:function(){
        //全部a標籤新標籤打開
        $("td a").attr('target','_blank');
        //給每一行加一個咱們的按鈕。
        $(".s-hide").remove();
        $("tr.text-center td:last-child").append('<span class="s-hide" style="margin:0 5px;cursor:pointer;">隱藏</span>');
        $("tr th:last").width(170);
        //給tr加上id。方便操做
        $("tr").each(function(index, el) {
            $(this).attr('data-id',$(this).find("input:checkbox").val());
        });
    },
    bindEvent:function(){        
        //點擊隱藏。
        $("body").on('click', '.s-hide', function(event) {
            
            var id = $(this).parents('tr').find("input:checkbox").val();
            var hideStr = localStorage.hideStr || '';
            var hideArr = hideStr.split("-");
            hideArr.push(id);
            localStorage.hideStr = hideArr.join("-");
            $(this).parents("tr").hide();
        });
    },
    //初始化的時候隱藏咱們隱藏過的。
    hideItems:function(){
        var hideStr = localStorage.hideStr || '';
        var hideArr = hideStr.split("-");
        var len = hideArr.length;
        for (var i = 0; i < len; i++) {
            $("tr[data-id="+hideArr[i]+"]").hide();
        }
    },
    //顯示隱藏的。
    show:function(){
        localStorage.hideStr = '';
        $("tr").show();
    }
}
//調用
var cd = new CD;
cd.init();

// 顯示所有請手動調用　　cd.show();

嗯，JavaScript能作的事實在太多。
面對別人的網站，咱們也能夠大有可爲。
不少瀏覽器插件，其實也是在別人的網站上運行本身的腳本實現 一些操做。好比攔截廣告。搶月餅。。。
做爲一個前端程序員來說，順手寫幾行腳本提升一點工做效率也是不錯的。

github:https://github.com/liusaint/J...
注：本文同步發表在個人CSDN博客上。